《基于新信息技術(shù)的JavaScript程序設(shè)計(jì)基礎(chǔ)》課件-第7章

項(xiàng)目7正則表達(dá)式任務(wù)1先導(dǎo)知識(shí)：正則表達(dá)式、innerHTML和innerText任務(wù)2正則表達(dá)式用于驗(yàn)證表單控件內(nèi)容

任務(wù)1先導(dǎo)知識(shí)：正則表達(dá)式、innerHTML和innerText

7.1.1正則表達(dá)式正則表達(dá)式，又稱(chēng)正規(guī)表示法、常規(guī)表示法(RegularExpression，在代碼中常簡(jiǎn)寫(xiě)為regex、regexp或RE)，是計(jì)算機(jī)科學(xué)中的一個(gè)概念。正則表達(dá)式使用單個(gè)字符串來(lái)描述和匹配一系列符合某個(gè)句法規(guī)則的字符串。在很多文本編輯器里，正則表達(dá)式通常用來(lái)檢索和替換那些符合某個(gè)模式的文本。引入正則表達(dá)式是為了用更簡(jiǎn)潔的代碼嚴(yán)謹(jǐn)?shù)仳?yàn)證文本框中的內(nèi)容。

1.定義正則表達(dá)式

1)普通方式

普通方式如下：

varreg=/表達(dá)式/附加參數(shù)

例如：

varreg=/white/;

varreg=/white/g;

2)構(gòu)造函數(shù)

構(gòu)造函數(shù)如下：

varreg=newRegExp("表達(dá)式","附加參數(shù)")

例如：

varreg=newRegExp("white");

varreg=newRegExp("white","g");

2.表達(dá)式的模式

1)簡(jiǎn)單模式

簡(jiǎn)單模式如下：

varreg=/china/;

varreg=/abc8/;

2)復(fù)合模式

復(fù)合模式如下：

varreg=/^\w+$/;

varreg=/^\w+@\w+.[a-zA-Z]{2,3}(.[a-zA-Z]{2,3})?$/;

3.正則表達(dá)式的符號(hào)。

常用的正則表達(dá)式符號(hào)及說(shuō)明如表7.1所示。

7.1.2innerHTML和innerText

innerHTML用于獲取或設(shè)置指定元素標(biāo)記內(nèi)的HTML內(nèi)容，從元素標(biāo)記開(kāi)始到元素標(biāo)記結(jié)束(包括HTML標(biāo)記)。

innerText用于獲取或設(shè)置指定元素標(biāo)記內(nèi)的文本的值，從元素標(biāo)記開(kāi)始到元素標(biāo)記結(jié)束(不包括HTML標(biāo)記)。

innerHTML和innerText的區(qū)別是：innerHTML返回標(biāo)記內(nèi)的HTML內(nèi)容，其中包含HTML標(biāo)記；innerText返回標(biāo)記內(nèi)的文本的值，而不是HTML標(biāo)記的值。

任務(wù)2正則表達(dá)式用于驗(yàn)證表單控件內(nèi)容

7.2.1驗(yàn)證郵編和手機(jī)號(hào)碼正則表達(dá)式驗(yàn)證郵政編碼和手機(jī)號(hào)碼(中國(guó)的郵政編碼都是6位，手機(jī)號(hào)碼都是11位，并且手機(jī)號(hào)碼第1位都是1)的語(yǔ)法如下：varregCode=/^\d{6}$/;varregMobile=/^1\d{10}$/;

上述程序代碼運(yùn)行結(jié)果如圖7.1所示。圖7.1程序運(yùn)行結(jié)果

7.2.2驗(yàn)證年齡

我們用正則表達(dá)式對(duì)年齡進(jìn)行驗(yàn)證，年齡設(shè)定在0～120之間。10～99這個(gè)范圍都是兩位數(shù)，十位是1～9，個(gè)位是0～9，正則表達(dá)式為[1-9]\d；0～9這個(gè)范圍是一位，正則表達(dá)式為\d；100～119這個(gè)范圍是三位數(shù)，百位是1，十位是0～1，個(gè)位是0～9，正則表達(dá)式為1[0-1]\d；

根據(jù)以上介紹可知，所有年齡的個(gè)位都是0～9，當(dāng)百位是1時(shí)十位是0～1，當(dāng)年齡為兩位數(shù)時(shí)十位是1～9，因此0～119這個(gè)范圍的正則表達(dá)式為(1[0-1]|[1-9])?\d。年齡120是單獨(dú)的一種情況，需要單獨(dú)列出來(lái)。

上述程序代碼運(yùn)行結(jié)果如圖7.2所示。圖7.2程序運(yùn)行結(jié)果

7.2.3驗(yàn)證注冊(cè)頁(yè)面

使用正則表達(dá)式驗(yàn)證博客園注冊(cè)頁(yè)面，驗(yàn)證的內(nèi)容有用戶(hù)名、密碼、電子郵箱、手機(jī)號(hào)碼和生日。其中，用戶(hù)名只能由英文字母和數(shù)字組成，長(zhǎng)度為4～16個(gè)字符，并且以英文字母開(kāi)頭；密碼只能由英文字母和數(shù)字組成，長(zhǎng)度為4～10個(gè)字符