表单验证
表单：收集用户信息，并把信息发送给服务器程序进行处理
what
验证数据的格式，将符合标准数据格式要求的数据，发送给后台。
对用户的输入做格式校验，确保能够发送到后台服务器的数据一定是正确的。降低服务器的压力，提高用户体验
效果实现
-
得焦事件
用户输入提示
-
失焦事件
用户输入是否为空
表单验证的特效和页面布局息息相关
-
作用：①在用户输入时，给与用户各种输入的反馈提示
②真正的控制 表单是否能够进行提交
字符串的操作 String 对象
string对象专门用来处理字符串
- charAt()——返回在指定下标位置的字符
<script>var aa='1254你好'var bb='4567哈哈'//输入下标获取改下标的值console.log(aa.charAt(4));//结果：你</script>
- concat()——连接两个或更多字符串，并返回新的字符串
<script>var aa='1254你好'var bb='4567哈哈'var cc='789'//连接两个字符串，并返回一个新的字符串console.log(aa.concat(bb));console.log(aa.concat(cc));
//结果：1254你好4567哈哈// 1254你好789</script>
- indexOf()——返回某个指定的子字符串值在字符串中首次出现的位置
- includes()——查找字符串中是否包含指定的子字符串。是返回true，否则false
- lastIndexOf()——从后向前搜索字符串，并从起始位置(0)开始计算返回字符串最后出现的位置
<script>var aa='1254你好'var bb='4567哈哈'var cc='789'var dd='12345654123145532'//查找特定字符串在整个字符串中首次出现的位置console.log(dd.indexOf('5'));//查找特定字符串在整个字符串中最后出现的位置，从后向前搜索console.log(dd.lastIndexOf('5'));//查找字符串中是否包含特殊字符串console.log(dd.includes('565'));console.log(dd.includes('你好'));
//结果： 4 14 true false</script>
- replace()——用于在字符串中用一些字符替换另一些字符，或替换一个正则表达式匹配的字符串
- slice()——提取字符串的片段，并在新的字符串中返回被提取的部分
- split()——把字符串分割为字符串数组
<script>var aa='1254你好'var bb='4567哈哈'var cc='789'var dd='12345654123145532'//将特殊字符串替换到字符串中console.log(bb.replace('哈哈','你好'));console.log(bb);var ee=bb.replace('哈哈','你好')console.log(ee);//提取字符串，并返回被提取后的新的字符串console.log(dd.slice(4,11));console.log(dd);//var ff=dd.split('5654123');var ff=dd.slice(4,11);console.log(ff);//将字符串转换成数组console.log(bb.split(''));console.log(bb);var gg=bb.split('67');console.log(gg);
//结果:4567你好//4567哈哈
// 4567你好
// 5654123
// 12345654123145532
// 5654123
// ['4','5','6','7','哈','哈']
// 4567哈哈
// (2) ['45', '哈哈']</script>
- startsWith()——查看字符串是否以指定的字符串开头
- endsWith()——查看字符串是否以指定的字符串结尾
<script>var aa='1254你好'var bb='4567哈哈'var cc='789'var dd='12345654123145532'//字符串是否以特定字符串开头console.log(bb.startsWith('45'));console.log(bb.startsWith('5'));//字符串是否以特定字符串结尾console.log(bb.endsWith('哈哈'));console.log(bb.endsWith('5'));//结果：true false true false</script>
- substr(起始索引，提取的长度)——从起始索引号提取字符串中指定数目的字符
- substring()——提取字符串中两个指定的索引号直接的字符前闭后开
<script>var aa='1254你好'var bb='4567哈哈'var cc='789'var dd='12345654123145532'//起始位置，提取长度 提取字符串console.log(dd.substr(2,5));//起始位置，结束位置 提取字符串//结果：34565 345</script>console.log(dd.substring(2,5));
- toLowerCase()——把字符串转换成小写
- toUpperCase()——把字符串转换成大写
<script>var aa='1254你好'var bb='4567哈哈'var cc='789'var dd='12345654123145532'var hh='BCNSMDLKGAL'var ii='zcffaet'//把字符串转换成小写console.log(hh.toLowerCase());//把字符串转换成大写console.log(ii.toUpperCase());
//结果：bcnsmdlkgal// ZCFFAET</script>
- trim()——去除字符串两边的空格
- toString()——返回一个字符串
<script>var aa='1254你好'var bb='4567哈哈'var cc='789'var dd='12345654123145532'var hh='BCNSMDLKGAL'var ii='zcffaet'var jj=' jssfj 'var kk=parseInt(12346);//去除字符串两边的空格console.log(jj.trim());console.log(jj);//转换成字符串console.log(kk.toString());console.log(kk);</script>正则表达式
正则表达式，又称规则表达式，通常被用来检索、替换那些符合某个模式(规则)的文本
why
有一些比较复杂的校验使用字符串提供的方法不能很好的校验，
所以使用正则进行一些复杂校验
使用
-
创建正则表达式
-
字面量创建 (常用)
let reg = /表达式/；
-
构造函数
let reg=new RegExp(‘a,c’);
-
有很多具有特殊函数的符号，学会各种符号所表示的含义
-
使用正则表达式
test()：检索字符串中是否存在指定的值。存在返回true， 不存在返回false
正则表达式常用字符含义
-
\：转义字符，让具有特殊作用的符号，失去特殊作用，只保留 本身的符号
-
^ ：匹配行首，以XXX开头
-
[ ] ：表示范围区间，只表示一个字符的范围空间
[0-9][a-z][A-Z][0-9a-zA-Z][0-9|A-Z|a-z]- * ：匹配前面的子表达式 任意次
- + ：匹配前面的子表达式 至少1次
- ? ：匹配前面的子表达式 0或1次
- [^ ]：取反
[^0-9]：任意的非数字字符
[^a-z0-9A-Z]：除数字，字母之外的任意字符- | ：或者
- { }：位数
{3}:3位
{3,}:至少3位
{3,6}:3至6位- . ：匹配任意的单个字符
- $：匹配末尾，以XXX结尾
- g：全局匹配
- i：不区分大小写
- \w：任何单字字符
等价于：[a-z0-9A-Z]- \W：任何非单字字符
等价于：[^a-z0-9A-Z]- \s：任何空白符
等价于：[\t\n\r\f\v]- \S：任何非空白符
等价于：[^\t\n\r\f\v]- \d：任何数字
等价于：[0-9]- \D：除了数字之外的任何字符
等价于：[^0-9]
