表单验证之:正则验证(RegExp正则对象,登录、注册、数组)
一、正则表达式
1. 为什么要正则表达式?
(1).简洁的代码
(2).严谨的验证文本框中的内容
2.定义正则表达式
(1).简单模式
var reg=/表达式/附加参数
例: var reg=/white/;
var reg=/white/g;
(2).构造函数
var reg=new RegExp("表达式","附加参数")
例: var reg=new RegExp("white");
var reg=new RegExp("white","g");
3. 表达式的模式
(1).简单模式
var reg=/china/;
var reg=/abc8/;
(2).复合模式
var reg=/^\w+$/;
var reg=/^\w+@\w+.[a-zA-Z]{2,3}(.[a-zA-Z](2,3))?$/;
4. RegExp 对象
4.1属性
global |
RegExp对象是否具有标志g |
ignoreCase |
RegExp对象是否具有标志i |
multiline |
RegExp对象是否具有标志m |
4.2方法
test() 方法是一个正则表达式方法。用于检测一个字符串是否匹配某个模式,如果字符串中含有匹配的文本,则返回 true,否则返回 false。
exec() 方法用于检索字符串中的正则表达式的匹配。
该函数返回一个数组,其中存放匹配的结果。如果未找到匹配,则返回值为 null。
exec |
检索字符中是正则表达式的区配,返回找到的值,并确定其位置 |
test |
检索字符串中指定的值,返回true或false |
5.String 对象
match |
找到一个或多个正则表达式的匹配 |
search |
检索与正则表达式相匹配的值 |
replace |
替换与正则表达式匹配的字符串 |
split |
把字符串分割为字符串数组 |
6. 正则表达式符号
表达式 描述
[abc] 查找方括号之间的任何字符。
[0-9] 查找任何从 0 至 9 的数字。
(x|y) 查找任何以 | 分隔的选项。
元字符是拥有特殊含义的字符:
元字符 描述
\d 查找数字。
\s 查找空白字符。
\b 匹配单词边界。
\uxxxx 查找以十六进制数 xxxx 规定的 Unicode 字符。
量词:
量词 描述
n+ 匹配任何包含至少一个 n 的字符串。
n* 匹配任何包含零个或多个 n 的字符串。
n? 匹配任何包含零个或一个 n 的字符串
7. Select对象常用事件、方法和属性
类别 |
名称 |
描述 |
事件 |
onchange |
当改变选项时调用的事件 |
方法 |
add() |
向下拉列表中添加一个选项 |
属性 |
options[] |
返回包含下拉列表中的所有选项的一个数组 |
selectedIndex |
设置或返回下拉列表中被选项目的索引号 |
|
length |
返回下拉列表中的选项的数目 |
8. options对象常用事件、方法和属性
text:设置或返回某个选项的纯文本值
value:设置或返回被送往服务器的值
9.数组
9.1.创建数组
JavaScript 中使用 new 关键字来创建数组,语法如下:
// 创建空数组:
new Array()
// 创建 num 个元素的数组:
new Array(num)
// 直接创建带有元素值的数组:
new Array(element0,element1,element2...)
说明:Array(3) 表示创建元素个数为 3 的数组,但实际上该数组的元素个数仍然是可变的。
以下是常用的创建数组的例子:
var array_1 = new Array();
array_1[0] = 'a';
array_1[1] = 10.5;
array_1[2] = true;
var array_2 = new Array(3)
array_2[0] = {x:10, y:15};
array_2[1] = document.getElementById("article");
array_2[2] = new Array();
9.2. 数组元素的操作
9.2.1读取元素的值
数组包含了多个数组元素,对数组元素的访问是通过下标来完成的,注意下标是从 0 开始计数的:
var array_3 = new Array('a',10.5,true);
alert( array_3[1] ); // 输出:10.5
9.2.2修改元素的值
var array_3 = new Array('a',10.5,true);
array_3[1] = 20; // 赋新值给元素
alert( array_3[1] ); // 输出:20
如果想替换数组中的一个或多个元素,请参考《JavaScript splice 方法:插入、删除或替换数组的元素》。
9.2.3增加元素
JavaScript 支持以下标的新式直接在数组后面增加新的元素:
var array_3 = new Array('a',10.5,true);
array_3[3] = 'new value'; // 赋新值给元素
alert( array_3[3] ); // 弹出提示窗输出:20
增加数组元素更多的方法还可以参考:
9.2.3.1JavaScript push 方法:向数组的末尾添加一个或多个元素
push 方法实例
<script language="JavaScript">
var array_1 = new Array('a','b','c');
document.write( array_1.push(1,2) + '<br />' );
document.write( array_1 );
</script>
9.2.3.2JavaScript unshift 方法:向数组的开头添加一个或多个元素
unshift 方法实例
<script language="JavaScript">
var array_1 = new Array('a','b','c');
document.write( array_1.unshift(1,2) + '<br />' );
document.write( array_1 );
</script>
9.2.3.3JavaScript splice 方法:插入、删除或替换数组的元素
splice 方法删除元素实例
<script language="JavaScript">
var array_1 = new Array('a','b','c','d');
document.write( array_1.splice(1,2) + '<br />' );
document.write( array_1 );
</script>
splice 方法插入元素实例
当 num 参数设置为 0 且 element1 等参数不为空时,将把 element1, ... 等元素插入 start 处。
<script language="JavaScript">
var array_1 = new Array('a','b','c','d');
document.write( array_1.splice(1,0,'tom') + '<br />' );
document.write( array_1 );
</script>
splice 方法替换元素实例
当 num 参数设置大于 0 且 element1 等参数不为空时,将把 element1, ... 等元素替换在被删除的数组处。这个过程我们可以看做是上面删除元素与插入元素的结合。
<script language="JavaScript">
var array_1 = new Array('a','b','c','d');
document.write( array_1.splice(1,2,'tom') + '<br />' );
document.write( array_1 );
</script>
9.2.4删除元素
要删除数组元素,请参考以下内容:
9.2.4.1JavaScript pop 方法:向数组的末尾添加一个或多个元素
<script language="JavaScript">
var array_1 = new Array('a','b','c');
document.write( array_1.pop() + '<br />' );
document.write( array_1 );
</script>
9.2.4.2JavaScript shift 方法:向数组的开头添加一个或多个元素
<script language="JavaScript">
var array_1 = new Array('a','b','c');
document.write( array_1.shift() + '<br />' );
document.write( array_1 );
</script>
9.2.4.3JavaScript splice 方法:插入、删除或替换数组的元素
删除:
<script language="JavaScript">
var array_1 = new Array('a','b','c','d');
document.write( array_1.splice(1,2) + '<br />' );
document.write( array_1 );
</script>
插入:
<script language="JavaScript">
var array_1 = new Array('a','b','c','d');
document.write( array_1.splice(1,0,'tom') + '<br />' );
document.write( array_1 );
</script>
插入:
splice 方法替换元素实例
当 num 参数设置大于 0 且 element1 等参数不为空时,将把 element1, ... 等元素替换在被删除的数组处。这个过程我们可以看做是上面删除元素与插入元素的结合。
<script language="JavaScript">
var array_1 = new Array('a','b','c','d');
document.write( array_1.splice(1,2,'tom') + '<br />' );
document.write( array_1 );
</script>
提示:将数组元素赋值为 null 的方式,只能清除元素的值而不能删除该元素。
如果大家想浏览我的下一篇文章,请留言
此文章属于原创,不准随意转载:https://blog.csdn.net/LYQ2332826438