五,正则表达式
正则表达式的作用:
- 在输入框进行匹配字符
- 替换字符
- 提取字符
1,创建正则表达式
-
利用 RegExp对象来创建正则表达式
var re = new RegExp(/123/); console.log(re); console.log(typeof re);
-
利用字面量创建正则表达式
var re = /123/;
2,测试字符
-
利用
reObject.test()
来测试字符是否满足条件var re = /123/; console.log(re.test('123')); // true 只要包含123的字符返回都是true console.log(re.test('12')); // false console.log(re.test(1234)); // true
3,原字符类
var re1 = /^123$/ // 内容必须是123
var re2 = /[abc]/ // 只要包含a或b或c都返回true
var re2 = /^[abc]$/ // 只有abc三者中的一个才为true
var re2 = /^[a-z]$/ // 只要是26个英文中任何一个就true
var re2 = /^[a-zA-Z]$/ // 只要是26个英文中任何一个就true(不分大小写)
var re2 = /^[a-z0-9_-]$/ // 用户名标准
var re2 = /^[^a-z0-9_-]$/ // []里面的^是取反的意思,不能包含[]里面的内容
4,量词符
-
*
相当于 >= 0 可以出现 0 次或者很多次 -
+
相当于 >= 1 可以出现 1 次或者很多次 -
?
相当于 1 || 0 出现 1 次或 0 次 -
{n}
前面字符重复次数等于 n 次 -
{n, }
前面字符重复次数大于等于 3 -
{n,m}
前面字符重复次数大于等于 n,并小于等于16(注意: n和m之间不能有空格) -
()
表示优先级,例如(123){3}
代表 123 出现的次数必须是3次 -
案例:
var re = /^[a-zA-Z0-9_-]{6,16}$/ // 输入的值必须是在[]中出现的,并且次数是在6~16次
5,正则替换
-
字符串的替代方法
// 替换replace var str = 'green 和 red'; console.log(str.replace('green', 'yellow'));
-
re正则表达式字符串替换
var str = 'red 和 red 在 red'; var newStr = str.replace(/red/, 'green'); console.log(newStr);
-
正则表达式参数
-
g :全局匹配
-
i :忽略大小写
-
gi :全局匹配 + 忽略大小写
var text = document.querySelector('textarea'); var btn = document.querySelector('button'); var div = document.querySelector('div'); btn.addEventListener('click', function() { div.innerHTML = text.value.replace(/sb/gi, '*') // 全局都匹配,忽略大小写,把sb替换成** })
-