HTML5_数组-字符串-正则-表单验证-全局局部变量
来源：互联网 发布：淘宝不用钱买东西 编辑：程序博客网 时间：2024/06/14 17:27
inner.Text只能改变文本
inner.HTML改变文本内容，包含特效。
1、 数组
（1）定义数组
（2）join
不改变原来数组的内容。
（3）concat()连接数组
var arr1 = [90,91,92];var arr2 = [81,84];var arr3 = [76,78,79];var arr4 = arr1.concat(50,60,arr2,arr3);console.log(arr1); //现有的数组值不变console.log(arr4); （4）slice()获取
arr.slice(3)从下表3开始到最后，包含最后一个。
arr.slice(-5,-2)从后面数倒数第5个到倒数第2个。
不改变现有数组。
(5)splice()修改–改变现有数组的内容。
（6）翻转-改变现有数组的内容。
(7)排序-改变现有数组的内容。
（8）push\pop
(9)shift/unshift
Shift是删掉 unshift是添加
2、转义字符
- \n 换行符
- \r 回车符
- \t 水平制表符
- \’ 单引号
- \” 双引号
\ 反斜线
3、字符串
（1） 大小写转换
（2）获取指定字符
（3）检索字符串下标
（4）截取字符串
slice此处用法与数组一致，两者的区别是：对于负值，substring不识别，将负数认为0.
（5）分隔字符串
得到的结果为””, ”Tom”, ”Mary”, ”Jack”, ””
把“18832695159”分割成单个字符“1”“8”…”9”，就按（‘’）去分割。
按（）去分割结果为“18832695159”
(6)连接字符串
也可以用加号“+”
（7）替换
replace（“字符串1”，“字符串2”） 用字符串2替换字符串1.
用双引号和//都可以。
(8)匹配
（9）搜索
G对多个相同的都替换。
3、正则表达式
（1）
^是开始符号，第一个字符是1，第二个是3或5或8，\d{9}表示任意九个数，$是结束符号。
（2）
显示true ture
[^abc]只要里面有一个不是a或b或c中的一个就是true
[abc]只要里面有一个是a或b或c中的一个就是true
（3）
对于a？和a*,无论有无a,或者有多少个a，都是true.
对于a{3}，此图为true,若是aqawewa，则为flase，a必须连续出现。
（4）选择
（5）
结果为true,若改为“hiss”则为flase.
表示以his为边界，其后相邻的无字符，不代表一定是结尾。 
结果为flase 
结果为true.不管字符串中有一个满足条件的就是true.
(6)创建正则对象
很少用到以下方法，除了test()
(7)替换
（8）匹配
有无？的区别：不带问号只会找到第一个和最后一个，带问号就按顺序依次查找。
带？是贪婪匹配
（9）搜索
（10）分割
4、onblur失去焦点事件
onfocus获取焦点事件
表单验证代码如下：没有用placeholder,用别的方法代替的。
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>表单验证</title> <style type="text/css"> *{ margin: 0; padding: 0; } #box{ width: 300px; height: 300px; margin: 100px auto; border: 1px solid #ccc; } label{ width: 100px; display: inline-block; padding-left: 20px; box-sizing: border-box; text-align: right; margin: 10px 0; } #sub{ width: 100px; margin: 10px auto; display: block; } .p1{ font-size: 12px; color: red; margin-left: 110px; visibility: hidden; } </style> </head> <body> <div id="box"> <form action="https://www.baidu.com" onsubmit="return oB()"> <label for="uname">用户名：</label> <input type="text" id="uname" value="请输入手机号" style="color: #CCCCCC;" /> <p class="p1">请输入正确的手机号</p> <label for="pas">密码：</label> <input type="text" id="pas" value="请输入密码" style="color: #CCCCCC;" /> <p class="p1">密码长度为6-16位</p> <label for="pas1">确认密码：</label> <input type="text" id="pas1" value="请再次输入密码" style="color: #CCCCCC;" /> <p class="p1">两次密码不一致</p> <input type="submit" id="sub" value="提交" /> </form> </div> </body> <script type="text/javascript"> //onblur 失去焦点 //onfocus 获得焦点 function getClass(abc){ if (document.getElementsByClassName) { return document.getElementsByClassName(abc); } else{ var list = document.getElementsByTagName('*'); var arr = []; for (var i = 0; i < list.length; i ++) { if (list[i].className==abc) { arr.push(list[i]); } } return arr; } } var oName = document.getElementById("uname"); var oPas = document.getElementById("pas"); var oPas1 = document.getElementById("pas1"); var oP = getClass('p1'); var reg = /^1[358]\d{9}$/; oName.onfocus = function(){ if (this.value=='请输入手机号') { this.value = ''; } this.style.color = '#333'; } oName.onblur = function(){ var that = this; if (this.value == '' ) { this.value = '请输入手机号'; this.style.color = '#ccc'; } if (!reg.test(that.value)) { oP[0].style.visibility = 'visible'; return false; }else{ oP[0].style.visibility = 'hidden'; return true; } } oPas.onfocus = function(){ if (this.value == '请输入密码') { this.value = ''; } this.type = 'password'; this.style.color = '#333'; } oPas.onblur = function(){ if (this.value=='') { this.type = 'text'; this.style.color = '#ccc'; this.value = '请输入密码'; } if (this.value.length<6||this.value.length>16) { oP[1].style.visibility = 'visible'; return false; }else{ oP[1].style.visibility = 'hidden'; return true; } } oPas1.onfocus = function(){ if (this.value == '请再次输入密码') { this.value = ''; } this.type = 'password'; this.style.color = '#333'; } oPas1.onblur = function(){ if (this.value == '') { this.type = 'text'; this.style.color = '#ccc'; this.value = '请再次输入密码'; } if (oPas.value!=oPas1.value) { oP[2].style.visibility = 'visible'; return false; }else{ oP[2].style.visibility = 'hidden'; return true; } } function oB(){ if (oName.onblur()&&oPas.onblur()&&oPas1.onblur()) { return true; }else{ return false; } } </script></html>注： 
关于善知教育（官网：善知教育（点击进入） 微信公众号：善知技术）
地址：北京东燕郊经济技术开发区文化大厦
咨询老师郑老师 电话/微信：13315631002 QQ:1939441377
目前我们开设Java服务器Html5前端网页Android移动端PHP服务器，有全日制班有周末班;
学费优惠至8480!!!!
我们的优势：
- 基础课程一个月免费学,全程面授;
- 平均就业薪资10000-15000;
- 免费重听，跨学科免费学习;
- 5-5.5个月大容量技术授课;
- 0学费0基础入学，海量项目实训, 弹性教学制度;
- 大部分学生找到月薪10k以上薪资工作, 项目实训自然终止;
- 课程全程视频录制,偶尔耽搁也不担心;
- 学习途中随时可以无理由退费根据学生情况;
- 灵活安排授课时间，一个科目学不会可以免费学习另一个科目;
- 全日制班，周末班，网上授课同时进行;
- 技术交流QQ群：198983438（加群请备注在哪里看到我们的群）在群里面随时会更新一些我们的课程视频以及开班动态
善知教育学习视频大汇总
- 善知教育石老师Java视频的网盘地址http://pan.baidu.com/s/1eQ0JHi6
- 善知教育吕老师Java视频http://pan.baidu.com/s/1i44RTjR
- 善知教育武老师Html5视频http://pan.baidu.com/s/1hsGGKnE
- 善知教育石老师Android知识点http://pan.baidu.com/s/1hsBpOQo
- HTML5_数组-字符串-正则-表单验证-全局局部变量
- HTML5_兼容-全局与局部的区别
- 字符串指针和字符数组,静态全局、静态局部、全局和局部变量区别,字符串常量和字符串变量,程序的内存分配
- js全局局部变量
- 全局和局部变量
- 全局和局部变量
- 全局与局部变量
- 全局/局部变量
- day09 数组形参、递归、全局/局部变量、static
- 关于字符串，字符数组 ，局部和全局地址分配问题
- 全局数组变量和局部数组变量的访问越界问题
- JS-全局和局部变量
- c全局和局部变量
- python的全局局部变量
- python基础-全局 & 局部 变量
- 1.正则表单验证2.全局变量作为形参传入函数内部操作之后，变量的值在全局上不发生改变的解决方法
- 全局变量，全局静态变量，局部变量，静态局部变量
- 局部变量，局部静态变量，全局变量，全局静态变量分别
- java8 方法引用
- 数据结构链表
- mongodb基础篇（一）之 SQL和NOSQL的那些事
- 继续畅通工程
- Linux 开机运行 Redis4
- HTML5_数组-字符串-正则-表单验证-全局局部变量
- laravel框架手机发送验证码
- [Leetcode] Week Two & Three ------ Array
- 102. Binary Tree Level Order Traversal(Java)
- Swift_学习笔记_基础知识
- java 中 对象的复制
- 根据算法思路自己实现了kmp算法（未优化）
- react-native 导入本地Image Error： "unexpected character"
- LintCode148
