正則表示式基礎及應用
正則表示式,按照我自己的理解,其實就是字串的操作校驗,所以先介紹關於字串操作的知識:
第一個是search 查詢搜尋:
var str='abcdef'
alert(str.search('b'))
//找到對應的位置 下標從0開始 沒有找到對應的 返回是-1
第二個是substring 字串擷取
var str='abcdef'
//第一個引數是起點 第二個引數是終點 擷取的範圍不包括終點的值----------
alert(str.substring(2,5))
//從起點開始 範圍包括起點
alert(str.substring(1))
第三個是 charAt 返回字串的某一位 下標從0開始
var str='abcdef'
//charAt 返回字串的某一位 下標從0開始
alert(str.charAt(3))
第四個是 split 切割後存放到陣列
var text = '1995-11-20'
var arr = text.split('-')
alert(arr)
下面舉例通過字串操作的方法,將一串字串中的數字提取出來:
var str = '12 fff 87 er334 233 -=-=fa80'; var arr=[]; var tmp = ''; //迴圈字串 for(var i=0;i<str.length;i++){ //判斷字串中的每一位是否為數字 如果是的話就存進到tmp中 然後推進到arr陣列中 if(str.charAt(i)>='0' && str.charAt(i)<='9'){ tmp +=str.charAt(i) }else{ if(tmp){ arr.push(tmp); tmp='' } } } if(tmp){ arr.push(tmp); tmp='' } alert(arr)
可以看出 這種方法,程式碼量多,並且只是一個小功能而已,那麼如果用正則表示式去匹配呢?
正則表示式對字串的操作
正則表示式的 search 字串搜尋
var re = new RegExp('a');//獲取一個字串
var re = new RegExp('a','i');//獲取一個字串 忽略大小寫
var str = 'hdjoAAAshd ';
alert(str.search(re));
正則表示式的 match 獲取匹配的專案 把所有匹配的東西都提取出來
\d 表示一位數字 如果要匹配多位數 就要多一個\d
g表示匹配對應得上的全部專案 +代表若干個 就是多少都可以
var re = /\d+/g;
var str ='adsf 34 656 cvs33'
alert(str.match(re));
//正則表示式的 replace 替換所有匹配項
var str = 'abc aaa erw'
var re = /a/g;
alert(str.replace(re,'0'));//將匹配項替換成0
正則表示式的量詞
{n} 代表n個 {n,m} 最少n個,最多m個 {n,}最少m個,最多不限
校驗電話號碼
/[1-9]\d{7}/
校驗QQ號最少五位數 最多11位數 且開頭數字不為0
/[1-9]\d{4,10}/
校驗固話
比如 010-87496698-分機號 前面010不一定需要 規則加上?號 表示可有可無
分為三塊 (0\d{2,3}-)? 代表區號 (-\d{1,5})?表示分機號 加上問號都是可有可無
/(0\d{2,3}-)?[1-9]\d{7}(-\d{1,5})?/
+號表示 至少1個 最多不限 {1,}
*號表示 至少0個 最多不限 {0,}
正則表示式的量詞
方括號作用是 裡面的值 任選一個 和外部的字元結合 進行匹配
[0-9] 0到9選一個 等價於 \d [a-z] a到z選一個
[^a-z] 除了字母 其他都要 [^a-z0-9] 除了數字和字母 其他都要
var str = 'apc vpc dpc gpc';
var re = /[ad]pc/g;
alert(str.match(re));
正則表示式的轉義字元
\d 代表數字 等價於 [0-9] \D 代表除了數字以外的 等價於 [^0-9]
\w 代表英文數字下劃線 等價於[a-z0-9_] \W 代表除了英文數字下劃線以外的 等價於 [^a-z0-9_]
\s 代表空白字元 不可列印不可顯示的字元 \D 代表非空白字元
. 代表任意字元
接下來看一些基礎應用例項:
第一個:敏感詞過濾: 在第一個文字框輸入敏感詞 點選按鈕過濾 將過濾後的內容 體現在第二個文字框
正則的寫法就是就是 匹配字有 背景 大會上 但收到貨 都要變成 ***
<body>
<textarea id="txt1" cols="40" rows="10"></textarea><br>
<input type="button" id="btn" value="過濾">
<textarea id="txt2" cols="30" rows="10"></textarea>
<script>
window.onload=function(){
var oTxt1 = document.getElementById('txt1');
var oTxt2 = document.getElementById('txt2');
var oBtn = document.getElementById('btn')
oBtn.onclick=function(){
//編寫規則
var re =/背景|大會上|但收到貨/g; // |代表或的意思
//將敏感詞過濾成*號
oTxt2.value = oTxt1.value.replace(re,'***')
}
}
</script>
</body>
第二個:過濾html標籤: 在第一個文字框輸入含html標籤的內容 點選按鈕過濾 將過濾後的內容 體現在第二個文字框
正則表示式就是將html標籤替換成空字元 :
<body>
<textarea id="txt1" cols="40" rows="10"></textarea><br>
<input type="button" id="btn" value="過濾">
<textarea id="txt2" cols="30" rows="10"></textarea>
<script>
window.onload=function(){
var oTxt1 = document.getElementById('txt1');
var oTxt2 = document.getElementById('txt2');
var oBtn = document.getElementById('btn')
oBtn.onclick=function(){
//編寫規則
var re =/<[^<>]+>/g; //
//將敏感詞過濾成*號
oTxt2.value = oTxt1.value.replace(re,' ')
}
}
</script>
</body>
第三個:校驗郵箱,在輸入框輸入一個郵箱,點選驗證,通過正則表示式的規則來判斷輸入的郵箱是否合法:
<body>
<input type="text" id="txt"/><br>
<input type="button" id="btn" value="檢驗"/>
<script>
//郵箱校驗
window.onload=function(){
var oTxt = document.getElementById('txt');
var oBtn = document.getElementById('btn');
oBtn.onclick=function(){
// 郵箱組成 一串 英文數字下劃線 加上 @ 加上 一串數字英文 加上.(需要轉義) 加上一串英文 不區分大小寫
//並且開頭到結尾都必須遵守這個規則
//開頭 ^ 結尾 $
var re = /^\[email protected][a-z0-9]+\.[a-z]+$/i
//正則檢驗 test
if(re.test(oTxt.value)){
alert('合法郵箱')
}else{
alert('不合法')
}
}
}
</script>
</body>
如果覺得有用的朋友可以加個關注,點個贊哦,歡迎交流!