- 正则表达式(Regular Expression)是用于匹配字符串中字符组合的模式。在JavaScript中,正则表达式也是对象。
- 灵活性、逻辑性和功能性非常强。
创建正则表达式
在JavaScript中,可以通过两种方式创建一个正则表达式
- 通过调用RegExp对象的构造函数创建
//利用RegExp来创建
var regexp = new RegExp(/123/);
console.log(regexp);
- 通过字面量创建
var 变量名 = /表达式/ ;
var rg = /123/; - 测试正式表达式 test
test()正则对象方法,用于检测字符串是否符合该规则,该对象会返回true或false,其参数是测试字符串。
//test方法用来检测字符串是否符合正则表达式要求的规范
var rg = /123/;
console.log(rg.test('ac'));
正则表达式的组成
正则测试工具:https://tool.oschina.net/regex
-
边界符
如果是^和$一起必须是精确匹配 -
字符类: [] 表示有一系列字符可供选择,只要匹配其中一个就可以了
[a - z] 表示范围
如果中括号里面有^表示取反的意思,要和边界符 ^ 别混淆
-
量词符
/^[a-zA-Z0-9_-]{6,16}$/
用户名验证
<style>
span {
color: #aaa;
}
.right {
color: green;
}
.wrong {
color: red;
}
</style>
</head>
<body>
<input type="text" class="uname"> <span>请输入用户名</span>
<script>
var reg = /^[a-zA-Z0-9_-]{6,16}$/;
var uname = document.querySelector('.uname');
var span = document.querySelector('span');
uname.onblur = function() {
if (reg.test(this.value)) {
// console.log('正确');
span.className = 'right';
span.innerHTML = '用户名格式输入正确';
} else {
// console.log('错误');
span.className = 'wrong';
span.innerHTML = '用户名格式输入错误';
}
}
</script>
</body>
-
括号总结
中括号 字符集合 匹配方括号中的任意字符(只选一个)大括号 量词符.里面表示重复次数
var reg = /^abc{3}$/ 只是让c重复3次
abccc小括号 表示优先级
var reg = /^(abc){3}$/; //它是让abc重复三次
在线测试:http://c.runoob.com/
预定义类
预定义类指的是某些常见模式的简写方式。
//正则里面或者的符号 |
正则表达式中的替换
replace() 方法可以实现替换字符串操作,用来替换的参数可以是一个字符串或是一个正则表达式
正则表达式参数
<textarea name="" id="" cols="30" rows="10"></textarea>
<button>单击</button>
<div></div>
<script>
var text = document.querySelector('textarea');
var btn = document.querySelector('button');
var div = document.querySelector('div');
btn.onclick = function() {
div.innerHTML = text.value.replace(/激情|gay/g, '**');
}
</script>