JavaScript 正規(guī)表示式

正規(guī)表示式（英文：Regular Expression，在程式碼中常簡寫為regex、regexp或RE）使用單一字串來描述、匹配一系列符合某個句法規(guī)則的字串搜尋模式。

搜尋模式可用於文字搜尋和文字取代。

什麼是正規(guī)表示式？

正規(guī)表示式是由一個字元序列形成的搜尋模式。

當(dāng)你在文字中搜尋資料時，你可以用搜尋模式來描述你要查詢的內(nèi)容。

正規(guī)表示式可以是一個簡單的字符，或是更複雜的模式。

正規(guī)表示式可用於所有文字搜尋和文字取代的操作。

語法

/pattern/modifiers;

實(shí)例：

var patt = /phpl/i

實(shí)例解析：

/php/i? 是正規(guī)表示式。

php? 是一個模式 (用於檢索)。

i? 是一個修飾符 (搜尋不區(qū)分大小寫)。

使用字串方法

在JavaScript 中，正規(guī)表示式通常用於兩個字串方法: search() 和replace()。

search() 方法?用於檢索字串中指定的子字串，或檢索與正規(guī)表示式相符的子字串，並傳回子字串的起始位置。

replace() 方法?用於在字串中用一些字符替換另一些字符，或替換一個與正則表達(dá)式匹配的子串。

search() 方法使用正規(guī)表示式

實(shí)例

使用正規(guī)表示式搜尋"php.cn" 字串，且不區(qū)分大小寫：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>PHP中文網(wǎng)(php.cn)</title>
</head>
<body>
<p>搜索字符串 "php.cn", 并顯示匹配的起始位置：</p>
<button onclick="myFunction()">點(diǎn)我</button>
<p id="demo"></p>
<script>
    function myFunction() {
        var str = "Visit php.cn!";
        var n = str.search(/php.cn/i);
        document.getElementById("demo").innerHTML = n;
    }
</script>
</body>
</html>

執(zhí)行程式嘗試

search( ) 方法使用字串

search 方法可使用字串作為參數(shù)。字串參數(shù)會轉(zhuǎn)換為正規(guī)表示式：

實(shí)例

檢索字串中"php.cn" 的子字串：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>PHP中文網(wǎng)(php.cn)</title>
</head>
<body>
<p>搜索字符串 "php.cn", 并顯示匹配的起始位置：</p>
<button onclick="myFunction()">點(diǎn)我</button>
<p id="demo"></p>
<script>
    function myFunction() {
        var str = "Visit php.cn!";
        var n = str.search("php.cn");
        document.getElementById("demo").innerHTML = n;
    }
</script>
</body>
</html>

執(zhí)行程式嘗試

replace() 方法使用正規(guī)表示式

##實(shí)例

使用正規(guī)表示式且不區(qū)分大小寫將字串中的Microsoft 替換為php.cn :

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>PHP中文網(wǎng)(php.cn)</title>
</head>
<body>
<p>替換 "microsoft" 為 "php.cn" :</p>
<button onclick="myFunction()">點(diǎn)我</button>
<p id="demo">請訪問 Microsoft!</p>
<script>
    function myFunction() {
        var str = document.getElementById("demo").innerHTML;
        var txt = str.replace(/microsoft/i,"php.cn");
        document.getElementById("demo").innerHTML = txt;
    }
</script>
</body>
</html>

執(zhí)行程式嘗試一下

replace() 方法使用字串

replace() 方法將接收字串作為參數(shù)：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>PHP中文網(wǎng)(php.cn)</title>
</head>
<body>
<p>替換 "Microsoft" 為 "php.cn" :</p>
<button onclick="myFunction()">點(diǎn)我</button>
<p id="demo">請訪問 Microsoft!</p>
<script>
function myFunction() {
    var str = document.getElementById("demo").innerHTML; 
    var txt = str.replace("Microsoft","php.cn");
    document.getElementById("demo").innerHTML = txt;
}
</script>
</body>
</html>

執(zhí)行程式嘗試一下

提示：

正則表達(dá)式參數(shù)可用在上述方法中(替代字串參數(shù))。

正規(guī)表示式使得搜尋功能更加強(qiáng)大(如實(shí)例中不區(qū)分大小寫)。

正規(guī)表示式修飾符

#修飾詞?可以在全域搜尋中不區(qū)分大小寫:

修飾符描述i執(zhí)行對大小寫不敏感的匹配。 g執(zhí)行全域匹配（查找所有匹配而不是在找到第一個匹配後停止）。 m執(zhí)行多行比對。

正規(guī)表示式模式

方括號用於尋找某個範(fàn)圍內(nèi)的字元：

#表達(dá)式	描述
[abc]	找出方括號之間的任何字元。
[0-9]	找出任何從 0 至 9 的數(shù)字。
(x\|y)	找出任何以 \| 分隔的選項。

元字元是擁有特殊意義的字元：

元字元	描述
\d	找出數(shù)字。
\s	尋找空白字元。
\b	符合單字邊界。
\uxxxx	找出以十六進(jìn)位數(shù) xxxx 規(guī)定的 Unicode 字元。

量詞：

n 的字串。 n 的字串。

#量詞	描述

	#n+符合任何包含至少一個
	n*符合任何包含零個或多個

######n?######符合任何包含零個或一個 ###n### 的字串。 ############

使用 RegExp 物件

#在 JavaScript 中，RegExp 物件是一個預(yù)先定義了屬性和方法的正規(guī)表示式物件。

使用 test()

test() 方法是一個正規(guī)表示式方法。

test() 方法用於偵測字串是否符合某個模式，如果字串中包含符合的文本，則傳回 true，否則傳回 false。

以下實(shí)例用於搜尋字串中的字元"e"：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>PHP中文網(wǎng)（php.cn）</title>
</head>
<body>
<script>
    var patt1=new RegExp("e");
    document.write(patt1.test("The best things in life are free"));
</script>
</body>
</html>

運(yùn)行程式嘗試一下

可以不用設(shè)定正規(guī)表示式的變量，以上兩行程式碼可以合併為一行：

/e/.test("The best things in life are free!")

#使用exec()

exec() 方法是正規(guī)表示式方法。

exec() 方法用於檢索字串中的正規(guī)表示式的符合。

該函數(shù)傳回一個數(shù)組，其中存放匹配的結(jié)果。如果未找到匹配，則傳回值為 null。

以下實(shí)例用於搜尋字串中的字母"e":

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>PHP中文網(wǎng)(php.cn)</title>
</head>
<body>
<script>
    var patt1=new RegExp("e");
    document.write(patt1.exec("The best things in life are free"));
</script>
</body>
</html>

執(zhí)行程式嘗試

繼續(xù)學(xué)習(xí)

新建檔案

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>PHP中文網(wǎng)(php.cn)</title> </head> <body> <p>搜索字符串 "php.cn", 并顯示匹配的起始位置：</p> <button onclick="myFunction()">點(diǎn)我</button> <p id="demo"></p> <script> function myFunction() { var str = "Visit php.cn!"; var n = str.search(/php.cn/i); document.getElementById("demo").innerHTML = n; } </script> </body> </html>

提交重置程式碼

自動運(yùn)行