正則表達(dá)式與HTML5新元素

ProcessOn是一個(gè)在線協(xié)作繪圖平臺(tái),為用戶提供最強(qiáng)大、易用的作圖工具!

它可以很方便的在線簡(jiǎn)單繪制一些東西，讓自己去具體理解。

正則表達(dá)式

今日的正則只是學(xué)習(xí)正則的簡(jiǎn)單使用。在HTML5的標(biāo)簽屬性的強(qiáng)大面前，我們已經(jīng)可以不用去先學(xué)習(xí)javascript才能再去正則了，因?yàn)镠TML5的input標(biāo)簽的pattern可以實(shí)現(xiàn)標(biāo)簽的驗(yàn)證，近似取代復(fù)雜的javascript使用正則驗(yàn)證表單，在未來(lái)一定會(huì)完全取代的。

正則的簡(jiǎn)單使用：

[0-9] 查找任何從 0 至 9 的數(shù)字。
[a-z] 查找任何從小寫(xiě) a 到小寫(xiě) z 的字符。
[A-Z] 查找任何從大寫(xiě) A 到大寫(xiě) Z 的字符。
[A-z] 查找任何從大寫(xiě) A 到小寫(xiě) z 的字符。
n{X} 匹配包含 X 個(gè) n 的序列的字符串。
n{X,Y} 匹配包含 X 或 Y 個(gè) n 的序列的字符串。
n{X,} 匹配包含至少 X 個(gè) n 的序列的字符串。

記得這幾個(gè)可以實(shí)現(xiàn)簡(jiǎn)單的正則運(yùn)算了。如：

form action="#">
input type="text" pattern="[0-9a-zA-Z]{1,}" required>
input type="submit" value="提交">
/form>

這就是個(gè)簡(jiǎn)單驗(yàn)證范圍在1個(gè)字符以上的任意0到9或a到z或A到Z的表單驗(yàn)證，而required是設(shè)置這個(gè)文本為必填項(xiàng)，否則會(huì)在提交表單時(shí)提示填寫(xiě)。

而具體的使用正則，則需要記得元字符、量詞及方括號(hào)的用意。

pattern屬性規(guī)定了正則的匹配方式，還有只能是編寫(xiě)與正則匹配的長(zhǎng)度。

它現(xiàn)在無(wú)法現(xiàn)實(shí)到像javascript的RegExp對(duì)象那么方便，不可以去設(shè)置修飾符，就是設(shè)置全局或大小寫(xiě)敏感等。

但它的功能已經(jīng)很強(qiáng)大了。

而為什么無(wú)法設(shè)置修飾符，因?yàn)樗钦齽t表達(dá)式，而在w3c里解釋是pattern 是正則表達(dá)式，而不是字符串，則必須省略該修飾符，所以它不能設(shè)置這個(gè)修飾符，不是會(huì)出錯(cuò)。

補(bǔ)充小知識(shí)：匹配中文的正則

[\u4e00-\u9fa5]這個(gè)確實(shí)只匹配中文

[^\x00-\xff]這個(gè)匹配所有非ASCII的字符，也就是一般意義上的半角字符，而這些%?。ㄖ惖氖侨亲址?。

HTML5之音頻與視頻元素

audio音頻標(biāo)簽

audio controls autoplay loop >
source src="URL" type="audio/mp4">
source ssrc="URL" type="audio/ogg">
p>你的瀏覽器不支持/p> 
/audio>

效果圖：

它的屬性：

autoplay autoplay 如果出現(xiàn)該屬性，則音頻在就緒后馬上播放。

controls controls 如果出現(xiàn)該屬性，則向用戶顯示控件，比如播放按鈕。

loop loop 如果出現(xiàn)該屬性，則每當(dāng)音頻結(jié)束時(shí)重新開(kāi)始播放。

preload preload 如果出現(xiàn)該屬性，則音頻在頁(yè)面加載時(shí)進(jìn)行加載，并預(yù)備播放。如果 使用 "autoplay"，則忽略該屬性。

src url 要播放的音頻的 URL。

video視頻標(biāo)簽

video controls loop muted width="400" height="400" poster="播放前的顯示圖片URL">
source src="視頻本地地址URL" type="video/mp4">
source src="視頻本地地址URL" type="video/ogg">
p>你的瀏覽器不支持/p> 
/video> 

它的屬性：

autoplay autoplay 如果出現(xiàn)該屬性，則視頻在就緒后馬上播放。

controls controls 如果出現(xiàn)該屬性，則向用戶顯示控件，比如播放按鈕。

loop loop 如果出現(xiàn)該屬性，則當(dāng)媒介文件完成播放后再次開(kāi)始播放。

muted muted 規(guī)定視頻的音頻輸出應(yīng)該被靜音。

poster URL 規(guī)定視頻下載時(shí)顯示的圖像，或者在用戶點(diǎn)擊播放按鈕前顯示的圖像。

preload preload 如果出現(xiàn)該屬性，則視頻在頁(yè)面加載時(shí)進(jìn)行加載，并預(yù)備播放。如果 使用 "autoplay"，則忽略該屬性。

src url 要播放的視頻的 URL。

width pixels 設(shè)置視頻播放器的寬度。

height pixels 設(shè)置視頻播放器的高度。

它們都有三種格式一種是mp4，一種是ogg，還有一種webm，目前在這方面支持的格式還不夠完善。

以上所述是小編給大家介紹的正則表達(dá)式與HTML5新元素，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！