一、正則表達式
正則表達式是由普通字符及特殊字符組成的對字符串進行過濾的邏輯公式
創建方式
-
字符量的方式：
var reg = /abc/； -
構造函數
var reg = new RegExp(“abc”);
二、正則表達式方法
| 方法名 | 作用 | 返回值 |
|---|---|---|
| test | 檢測是否有符合表達式規則的子串 | 有返回true，否則返回false |
| match | 檢索指定的值 | 這些值組成的數組 |
| search | 查找符合規則的子串 | 第一個匹配成功的位置 |
| split | 分割 | 返回數組 |
| replace | 替換 | 返回替換後的值 |
| exec | 將匹配成功的放到數組裏 | 匹配成功的值，沒有成功則返回null |
注：exec如果要全部輸出，需要多次調用，一次只能輸出一個
<script type="text/javascript">
/*創建方法*/
var reg=/abc/;//1.字面量的方式
var reg=new RegExp("abc");//2.構造函數
/*方法*/
//test方法 用來檢測是否有符合表達式規則的子串，有返回true，無返回false
var str="aabcd";
console.log(reg.test(str));
//修飾符 g i
//g表示全局匹配
//i不區分大小寫
//match方法 檢索指定的值 返回值也是這些指定的值組成的數組
var reg=/abc/ig;
var str="aAbcabc";
console.log(str.match(reg));
//seach方法，查找符合規則的子串的位置，只返回第一個匹配的位置
var reg=/abc/;
var str="12abc4";
console.log(str.search(reg));
//split 分割 返回數組
var reg=/ /;
var str="good good study";
console.log(str.split(reg));
//replace 替換
var reg=/aaa/ig;
var str="aaa aaa study";
console.log(str.replace(reg,"good"));
//exe方法，將匹配成功的方法放到數組裏，如果沒有匹配成功，返回null
//如果要全部輸出 則需要多次調用，一次只能輸出一個
var reg=/good/g;
var str="good good study";
console.log(reg.exec(str));
console.log(reg.exec(str));
console.log(reg.exec(str));
</script>
輸出：
true
Array(2)
2
Array(3)
good good study
Array(1)
Array(1)
nul
三、正則表達式中的特殊字符
| 字符 | 作用 |
|---|---|
| . | 代表除了換行符外的所有單個字符 |
| * | 重複多次匹配（0-n） |
| + | 至少一次重複匹配 |
| ？ | 進行零次或者一次匹配 |
| [ ] | 表示可以匹配到的範圍 |
| \w | 數字字母下劃線 |
| \W | 非數字字母下劃線 |
| \d | 表示數字 |
| \D | 非數字 |
| \s | 匹配空格 |
| {m,n} | 至少匹配m次，最多匹配n次 |
| /^ | 匹配開始 |
| $/ | 匹配結束 |
| （） | 分組 將內容作爲一個整體進行匹配 |
| $1,$2 | 代表分組的元素 |
<script type="text/javascript">
//. 除了換行符外的所有單個字符
var reg=/g..d/gi;
var str="goodg--dg/-d";
console.log(reg.test(str),str.match(reg));
//* 重複多次匹配，匹配任意次（0-n）,只作用於前一個字符
var reg=/go*d/gi;
var str="goodgogod";
console.log(reg.test(str),str.match(reg));
//+ 至少有一次重複匹配
var reg=/go+d/gi;
var str="goodgdgodgoooood";
console.log(reg.test(str),str.match(reg));
//? 進行零次或者一次匹配
var reg=/go?d/gi;
var str="gdgodgood";
console.log(reg.test(str),str.match(reg));
//[] 表示可以匹配到的範圍
var reg=/[a-z]+/gi;
var str="asjfij";
console.log(reg.test(str),str.match(reg));
//\w 代表數字字母下劃線 等同於[0-9a-zA-Z_] W\非數字字母下劃線
var reg=/\w+/ig;
var str="s4989_*";
console.log(reg.test(str),str.match(reg));
//\d 表示數字 \D非數字
var reg=/\d+/gi;
var str="1234s4";
console.log(reg.test(str),str.match(reg));
//\s 匹配空格
var reg=/\s+/gi;
var str="good good study";
console.log(str.replace(reg,""));
//{m,n} 至少匹配m次，至多匹配n次
var reg=/go{3,6}d/ig;
var str="goooodgoodgoooooood";
console.log(reg.test(str),str.match(reg));
// /^ 匹配開始 $/ 匹配結束
var reg=/^g.*g$/gi;
var str="goodgd";
console.log(reg.test(str),str.match(reg));
// | 或
var reg=/google|baidu|yahoo/gi;
var str="www.baidu.com";
console.log(reg.test(str),str.match(reg));
// () 分組 將內容作爲一個整體進行匹配
var reg=/(good){2,3}/gi
var str="goodgoodagood"
console.log(reg.test(str),str.match(reg));
console.log(RegExp.$1);
//$1 $2 代表分組的元素
var reg=/(.*)\s(.*)/;
var str="taobao baidu";
console.log(str.replace(reg,"$2 $1"));
</script>
輸出：
true Array(3) 0:"good" 1:"g--d" 2:"g/-d"
true Array(2) 0:"good" 1:"god"
true Array(3) 0:"good" 1:"god" 2:"goooood"
true Array(2) 0:"gd" 1:"god"
true Array(1) 0:"asjfij"
true Array(1) 0:"s4989_"
true Array(2) 0:"1234" 1:"4"
goodgoodstudy
true Array(1) 0:"gooood"
false null
true Array(1) 0:"baidu"
true Array(1) 0:"goodgood"
good
baidu taobao
四、一個小例子
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>用戶名規範</title>
<script type="text/javascript">
window.onload=function()
{
var oInput=document.getElementById("username");
oInput.onchange=function()
{
var str=this.value;
var reg=/^[a-zA-Z_]\w{5,14}$/;
if(reg.test(str))
{
alert("格式正確");
}else{
alert("用戶名由數字，字母下劃線組成的 6-15位字符，且不能以數字開頭");
}
}
}
</script>
</head>
<body>
用戶名：<input type="text" id="username" />
</body>
</html>