正则表达式:其实就是一种匹配规则,用于检索字符串
定义正则表达式的两种方式:1.直接定义 2.构造函数定义
那么正则表达式正则强大的地方是它可以写 通配符(拥有特殊含义的字符)
二. 通配符
\w 表示:字母、数字、下划线
\W 表示:除了字母、数字、下划线以外的字符
\d 表示:数字
\D 表示:非数字
^ 表示:以^符号后面的第一个字符开头
表示:以表示:以符号前面的第一个字符结尾
{n} 表示:重复n次
{n,m} 表示:重复n到m次
[xyz] 表示:其中任意一个字符
+ 表示:重复前一项1次或多次 等价于 {1,}
* 表示:重复前一项0次或多次 等价于 {0,}
? 表示:重复前一项0次或1次 等价于 {0,1}
. 表示:除了换行符以外的任意一个字符
\. 表示:.字符 ^ 表示:^ \表示:表示:
可以用()将多个字符作为一个整体
\w 等价于 [0-9a-zA-Z_]
| 表示:或者
[\u4E00-\u9FA5] 是常用汉字的unicode编码范围
三. 正则练习
四. 正则表达式配合字符串的方法
replace()方法
默认情况下,replace()方法,只会替换字符串中匹配的第一段内容
使用正则表达式,添加全局匹配修饰符g,可以替换匹配全部内容
使用正则表达式,添加忽略大小写修饰符i,在匹配内容时会忽略大小写
search()方法
可以通过正则表达式查找位置
五. 添加学生练习
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>添加学生</title>
<style>
.err{
color: red
}
.ok{
color: green
}
</style>
</head>
<body>
<form>
<table>
<tr>
<td>姓名:</td>
<td>
<input type="text" id="name">
<span id="nameMsg"></span>
</td>
</tr>
<tr>
<td>年龄:</td>
<td>
<input type="text" id="age">
<span id="ageMsg"></span>
</td>
</tr>
<tr>
<td>性别:</td>
<td>
<input checked name="sex" type="radio" value="0">男
<input name="sex" type="radio" value="1">女
</td>
</tr>
<tr>
<td>爱好:</td>
<td>
<input name="hobby" type="checkbox" value="抽烟">抽烟
<input name="hobby" type="checkbox" value="喝酒">喝酒
<input name="hobby" type="checkbox" value="烫头">烫头
<input name="hobby" type="checkbox" value="睡觉">睡觉
</td>
</tr>
<tr>
<td>年级:</td>
<td>
<select id="grade">
<option value="0">请选择</option>
<option value="1">大一</option>
<option value="2">大二</option>
<option value="3">大三</option>
<option value="4">大四</option>
</select>
<span id="gradeMsg">必须要选择一个年级</span>
</td>
</tr>
<tr>
<td>邮箱:</td>
<td>
<input type="text" id="email">
<span id="emailMsg">请输入正确的邮箱格式</span>
</td>
</tr>
<tr>
<td>电话:</td>
<td>
<input type="text" id="phone">
<span id="phoneMsg">请输入正确的电话格式</span>
</td>
</tr>
<tr>
<td>生日:</td>
<td>
<input type="text" id="bornDate">
<span id="bornDateMsg">请输入正确日期格式</span>
</td>
</tr>
<tr>
<td></td>
<td>
<button type="submit">提交</button>
<button type="reset">重置</button>
</td>
</tr>
</table>
</form>
<script>
//获取姓名文本框
let name = document.querySelector('#name')
//获取年龄文本框
let age = document.querySelector('#age')
//表单的提交事件
document.querySelector('form').onsubmit = function(){
// 返回true提交表单,返回false不提交表单
if(checkName() &checkAge()){
return true
}else{
return false
}
}
//姓名文本框失去焦点
name.onblur = checkName
//验证姓名
function checkName(){
//定义验证姓名的正则
let reg = /^[\u4E00-\u9FA5]{2,4}$/
// 调用验证方法
return checkInput("#nameMsg",name,reg,'姓名正确','姓名必须是2-4位汉字')
}
//年龄文本框失去焦点
age.onblur = checkAge
//验证年龄
function checkAge(){
//定义验证年龄的正则
let reg = /^\d{1,2}$|^1([0-1]\d)|20$/
// 调用验证方法
return checkInput("#ageMsg",age,reg,'年龄正确','年龄必须是0-120之间')
}
//验证方法,参数分别是:span元素Id,表单元素对象,正则规则,验证成功消息,验证失败消息
function checkInput(spanId,_this,reg,okMsg,errMsg){
// 获取消息span
let span = document.querySelector(spanId)
//获取信息
let val = _this.value
if(!reg.test(val)){
span.className="err"
span.innerHTML = errMsg
return false //验证失败返回false
}else{
span.className="ok"
span.innerHTML = okMsg
return true //验证成功返回true
}
}
</script>
</body>
</html>
字 符描 述\将下一个字符标记为一个特殊字符、或一个原义字符、或一个后向引用、或一个八进制转义符。例如,'n' 匹配字符 "n"。'\n' 匹配一个换行符。序列 '\\' 匹配 "\" 而 "\(" 则匹配 "("。^匹配输入字符串的开始位置。如果设置了 RegExp 对象的 Multiline 属性,^ 也匹配 '\n' 或 '\r' 之后的位置。$匹配输入字符串的结束位置。如果设置了RegExp 对象的 Multiline 属性,$ 也匹配 '\n' 或 '\r' 之前的位置。*匹配前面的子表达式零次或多次。例如,zo* 能匹配 "z" 以及 "zoo"。 * 等价于{0,}。+匹配前面的子表达式一次或多次。例如,'zo+' 能匹配 "zo" 以及 "zoo",但不能匹配 "z"。+ 等价于 {1,}。?匹配前面的子表达式零次或一次。例如,"do(es)?" 可以匹配 "do" 或 "does" 中的"do" 。? 等价于 {0,1}。{n}n 是一个非负整数。匹配确定的 n 次。例如,'o{2}' 不能匹配 "Bob" 中的 'o',但是能匹配 "food" 中的两个 o。{n,}n 是一个非负整数。至少匹配n 次。例如,'o{2,}' 不能匹配 "Bob" 中的 'o',但能匹配 "foooood" 中的所有 o。'o{1,}' 等价于 'o+'。'o{0,}' 则等价于 'o*'。{n,m}m 和 n 均为非负整数,其中n <= m。最少匹配 n 次且最多匹配 m 次。刘, "o{1,3}" 将匹配 "fooooood" 中的前三个 o。'o{0,1}' 等价于 'o?'。请注意在逗号和两个数之间不能有空格。?当该字符紧跟在任何一个其他限制符 (*, +, ?, {n}, {n,}, {n,m}) 后面时,匹配模式是非贪婪的。非贪婪模式尽可能少的匹配所搜索的字符串,而默认的贪婪模式则尽可能多的匹配所搜索的字符串。例如,对于字符串 "oooo",'o+?' 将匹配单个 "o",而 'o+' 将匹配所有 'o'。.匹配除 "\n" 之外的任何单个字符。要匹配包括 '\n' 在内的任何字符,请使用象 '[.\n]' 的模式。(pattern)匹配pattern 并获取这一匹配。在JScript 中则使用 $1…$9 属性。要匹配圆括号字符,请使用 '\(' 或 '\)'。(?:pattern)匹配 pattern 但不获取匹配结果,也就是说这是一个非获取匹配,不进行存储供以后使用。这在使用 "或" 字符 (|) 来组合一个模式的各个部分是很有用。例如, 'industr(?:y|ies) 就是一个比 'industry|industries' 更简略的表达式。(?=pattern)正向预查,在任何匹配 pattern 的字符串开始处匹配查找字符串。这是一个非获取匹配,也就是说,该匹配不需要获取供以后使用。例如, 'Windows (?=95|98|NT|2000)' 能匹配 "Windows 2000" 中的 "Windows" ,但不能匹配 "Windows 3.1" 中的 "Windows"。预查不消耗字符,也就是说,在一个匹配发生后,在最后一次匹配之后立即开始下一次匹配的搜索,而不是从包含预查的字符之后开始。(?!pattern)负向预查,在任何不匹配的字符串开始处匹配查找字符串。这是一个非获取匹配,也就是说,该匹配不需要获取供以后使用。例如'Windows (?!95|98|NT|2000)' 能匹配 "Windows 3.1" 中的 "Windows",但不能匹配 "Windows 2000" 中的 "Windows"。预查不消耗字符,也就是说,在一个匹配发生后,在最后一次匹配之后立即开始下一次匹配的搜索,而不是从包含预查的字符之后开始 x|y匹配 x 或 y。例如,'z|food' 能匹配 "z" 或 "food"。'(z|f)ood' 则匹配 "zood" 或 "food"。 [xyz]字符集合。匹配所包含的任意一个字符。例如, '[abc]' 可以匹配 "plain" 中的 'a'。 [^xyz]负值字符集合。匹配未包含的任意字符。例如, '[^abc]' 可以匹配 "plain" 中的'p'。 [a-z]字符范围。匹配指定范围内的任意字符。例如,'[a-z]' 可以匹配 'a' 到 'z' 范围内的任意小写字母字符。例如:[a-z] [A-Z] [0-9][^a-z]负值字符范围。匹配任何不在指定范围内的任意字符。例如,'[^a-z]' 可以匹配任何不在 'a' 到 'z' 范围内的任意字符。\b匹配一个单词边界,也就是指单词和空格间的位置。例如, 'er\b' 可以匹配"never" 中的 'er',但不能匹配 "verb" 中的 'er'。 \B匹配非单词边界。'er\B' 能匹配 "verb" 中的 'er',但不能匹配 "never" 中的 'er'。\cx匹配由x指明的控制字符。例如, \cM 匹配一个 Control-M 或回车符。 x 的值必须为 A-Z 或 a-z 之一。否则,将 c 视为一个原义的 'c' 字符。 \d匹配一个数字字符。等价于 [0-9]。 \D匹配一个非数字字符。等价于 [^0-9]。 \f匹配一个换页符。等价于 \x0c 和 \cL。\n匹配一个换行符。等价于 \x0a 和 \cJ。\r匹配一个回车符。等价于 \x0d 和 \cM。\s匹配任何空白字符,包括空格、制表符、换页符等等。等价于 [ \f\n\r\t\v]。\S匹配任何非空白字符。等价于 [^ \f\n\r\t\v]。\t匹配一个制表符。等价于 \x09 和 \cI。\v匹配一个垂直制表符。等价于 \x0b 和 \cK。\w匹配包括下划线的任何单词字符。等价于'[A-Za-z0-9_]'。 \W匹配任何非单词字符。等价于 '[^A-Za-z0-9_]'。 \xn匹配 n,其中 n 为十六进制转义值。十六进制转义值必须为确定的两个数字长。例如, '\x41' 匹配 "A"。'\x041' 则等价于 '\x04' &"1"。正则表达式中可以使用 ASCII 编码。.\num匹配 num,其中 num 是一个正整数。对所获取的匹配的引用。例如,'(.)\1' 匹配两个连续的相同字符。 \n标识一个八进制转义值或一个后向引用。如果 \n 之前至少 n 个获取的子表达式,则 n 为后向引用。否则,如果 n 为八进制数字 (0-7),则 n 为一个八进制转义值。\nm标识一个八进制转义值或一个后向引用。如果 \nm 之前至少有is preceded by at least nm 个获取得子表达式,则 nm 为后向引用。如果 \nm 之前至少有 n 个获取,则 n 为一个后跟文字 m 的后向引用。如果前面的条件都不满足,若 n 和 m 均为八进制数字 (0-7),则 \nm 将匹配八进制转义值 nm。\nml如果 n 为八进制数字 (0-3),且 m 和 l 均为八进制数字 (0-7),则匹配八进制转义值 nml。\un匹配 n,其中 n 是一个用四个十六进制数字表示的 Unicode 字符。例如, \u00A9 匹配版权符号 (?)。首尾不得为空 可以用jquery的$.trim()来清楚首尾的空字符不用jquery 用正则的话 这样来写
var reg=/^[^\s].*{1,68}[^\s]$/g
//上面这种可以实现前后不能有空 但不能严格的控制字符的长短 不能实现一位字符的判断 所以来换一种写法
var reg=/(?!^\s+)(?!\s+$).*{1,70}/g
手机回答的 不好亲自测试 如果不能用 你再找我!