一、正則表達式作用
測試字符串內的模式。
可以測試輸入字符串,以查看字符串內是否出現電話號碼模式或信用卡號碼模式或郵箱。即數據驗證。替換文本。
可以使用正則表達式來識別文檔中的特定文本,完全刪除該文本或者用其他文本替換它。從字符串中提取子字符串。
可以查找文檔內或輸入域內特定的文本。
二、一些術語
- 元字符:
即特殊字符,就是一些有特殊含義的字符。
例子:^匹配輸入字符串的開始位置。要匹配 ^ 字符本身,請使用 \^。 - 普通字符:
普通字符包括沒有顯式指定爲元字符的所有可打印和不可打印字符。大寫和小寫字母、數字、所有標點符號和其他符號。 - 非打印字符:
從字面意思來看就是不能打印的字符,在計算機程序範濤內,打印一般就是指的輸出。
例子:\n 換行 \r回車 - 限定符:
用來指定正則表達式的一個給定組件必須要出現多少次才能滿足匹配。有*或+或?或{n}或{n,}或{n,m}共6種。
三、js中正則應用
1、 兩種方式:
a、 構造函數:
當使用構造函數創造正則對象時,需要常規的字符轉義規則(在前面加反斜槓 \)。
1、var patt=new RegExp(pattern,modifiers);
var re = new RegExp("\\w+");
b、 簡單方式:
pattern : 任何簡單或複雜的正則表達式。
modifiers : 標誌可以有一個或多個,表明正則表達式的行爲。(g i m)
i : 表示匹配字符串不區分大小寫。
g : 表示在全局匹配字符串 ,不會在匹配到一次後停止。
m : 表示多行模式,在達到一行文本末尾時還會繼續查找下一行。
var patt=/pattern/modifiers;
var re = /\w+/;
2、match() :
可在字符串內檢索指定的值,或找到一個或多個正則表達式的匹配。類似 indexOf但它返回指定的值,而不是位置。
a、匹配字串:
var str="Hello world!"
console.log(str.match("world")) // world
console.log(str.match("World")) // null
console.log(str.match("worlld")) // null
console.log(str.match("world!")) // world!
b、匹配正則:
var str="Visit W3CSchool Visit W3CSchool Visit W3CSchool";
var patt1=/w3cschool/i;
document.write( str.match( patt1 ) ); // ["W3CSchool"]
var patt2 = /w3cschool/gi;
document.write( str.match( patt2 ) ); // ["W3CSchool", "W3CSchool", "W3CSchool"]
3、其他正則方法
a、test()方法:
test()方法搜索字符串指定的值,根據結果並返回真或假。
var str1 = "hello world I like code"
var patt3 = /e/g;
console.log( patt3.test(str1) ); // true
var patt31 = new RegExp( 'e' );
console.log( patt31 .test(str1) ); // true
b、exec()方法:
方法檢索字符串中的指定值。返回值是被找到的值。如果沒有發現匹配,則返回 null。
var str4 = " hello World everyone";
var patt4 = /wor/gi;
console.log( patt4.exec( str4 ) ); // ["Wor"]
c、search()方法
search() 方法不執行全局匹配,它將忽略標誌 g。它同時忽略 regexp 的 lastIndex 屬性,並且總是從字符串的開始進行檢索,這意味着它總是返回 stringObject 的第一個匹配的位置。
如果沒有找到任何匹配的子串,則返回 -1。
// 查找換行符\n
var str = "hat hot my telephone is 12202345672 10 email: [email protected] \n liuyongshun this his at"
var patt01 = /\n/g;
console.log( str.match( patt01 ) ); // \n
console.log( str.search( patt01 ) ); //63
四、一些規則和例子
var str = "hat hot my telephone is 12202345672 10 email: [email protected] \n liuyongshun this his at"
// search 括號內任意字符,爲設置g時,找到ema中的任何一個都會停止。[a-z]
var patt = /[ema]/;
console.log( str.match( patt ) );
// 查找除了括號內所有的字符。[^]
var patt1 = /[^ema]/g;
console.log( str.match( patt1 ) );
// 查找任何從 0 至 3 的數字。[0-5]
var patt2 = /[0-3]/g;
console.log( str.match( patt2 ) );
// 查找任何指定的選項。(em|liu|shun)
var patt3 = /(ema|is|liu)/g;
console.log( str.match( patt3 ) );
// 查找單個字符,除了換行和行結束符。 h.t
var patt4 = /h.t/g;
console.log( str.match( patt4 ) );
// 查找單詞字符。 \w(小寫)
var patt5 = /\w/g;
console.log( str.match( patt5 ) );
// 查找非單詞字符。\W(大寫)
var patt6 = /\W/g;
console.log( str.match( patt6 ) );
// 查找數字\d(小寫,大寫是查找非數字)
var patt7 = /\d/g;
console.log( str.match( patt7 ) );
var patt8 = /\D/g;
console.log( str.match( patt8 ) );
// 查找空白字符,包括回車
var patt9 = /\s/g;
console.log( str.match( patt9 ) );
var patt00 = /\S/g;
console.log( str.match( patt00 ) );
// 查找換行符\n
var patt01 = /\n/g;
console.log( str.match( patt01 ) );
console.log( str.search( patt01 ) ); //++++++++++++++++++
// 匹配任何包含至少一個h的字符串 h+
var patt02 = /h+/g;
console.log( str.match( patt02 ) );
var patt03 = /\w+/g; //\w指匹配單詞字符。
console.log( str.match( patt03 ) )
// 匹配任何結尾(整個字符串結尾)爲t的字符。t$
var patt04 = /t$/g;
console.log( str.match( patt04 ) );
// 匹配任何開始(整個字符串結尾)爲h的字符。^h
var patt05 = /^h/g;
console.log( str.match( patt05 ) );
// 匹配包含 X 個 n 的序列的字符串 n{X}
// n{X,Y}匹配包含 X 或 Y 個 n 的序列的字符串。(篩選千和萬和十萬和百萬)
// n{X,} 匹配包含至少 X 個 n 的序列的字符串。
var patt06 = /\d{11}/g;
console.log( str.match( patt06 ) );
// n? 匹配任何包含零個或一個 n 的字符串。
var patt07 = /10?/g; //這裏指的零個或一個0。
console.log( str.match( patt07 ) );
// ?=n 匹配任何其後緊接指定字符串 n 的字符串。
var patt08 = /one(?= is)/g;
console.log( str.match( patt08 ) );
// ?!n 匹配其後沒有緊接指定字符串 n 的任何字符串。
var patt09 = /is(?! at)/g;
console.log( str.match( patt09 ) );
console.log( patt09.exec( str ) ); //++++++++++++++++++++
console.log( patt09.test( str ) ); //++++++++++++++++++++
var str2 = "Mr Blue has a blue house and a blue car";
var n = str2.replace(/blue/gi,"red"); //+++++++++++++++++
console.log( n );
一些寫好的正則 在線正則
一個例子:
<form action="">
<input type="text" id="text" value="請輸入內容" onfocus="if(this.value == '請輸入內容'){this.value = ''}" onblur="if(this.value == ''){this.value = '請輸入內容'}">
<div id="judges">judgeFormContent</div>
</form>
var c = document.getElementById( 'judges' );
var d = document.getElementById( 'text' );
c.addEventListener( 'click', function() {
var string = d.value;
var patts = /\@/g;
var check = string.match( patts );
console.log( check );
if ( !check ) {
alert( '格式錯誤' );
} else {
alert( '這是郵箱' )
}
} )