今天互吾小編就整理下,那些你可能不知道的html5冷知識(shí)。
瀏覽器地址欄運(yùn)行JavaScript代碼
這個(gè)很多人應(yīng)該還是知道的,在瀏覽器地址欄可以直接運(yùn)行JavaScript代碼,做法是以javascript:開(kāi)頭后跟要執(zhí)行的語(yǔ)句。比如:
注意,執(zhí)行javascript代碼,要在瀏覽器中手工輸入,的話,IE及Chrome會(huì)自動(dòng)去掉代碼開(kāi)頭的javascript:,所以需要手動(dòng)添加起來(lái)才能正確執(zhí)行,而Firefox中雖然不會(huì)自動(dòng)去掉,但它根本就不支持在地址欄運(yùn)行JS代碼??!
瀏覽器地址欄運(yùn)行HTML代碼
如果說(shuō)上面那條小秘密知道的人還算多的話,這條秘笈知道的人就要少一些了,在非IE內(nèi)核的瀏覽器地址欄可以直接運(yùn)行HTML代碼!
反正連互吾小編我,也是最近才無(wú)意中得知的。
比如在地址欄輸入以下代碼然后回車運(yùn)行,會(huì)出現(xiàn)指定的頁(yè)面內(nèi)容。
如下圖:
把瀏覽器當(dāng)編輯器
還是瀏覽器地址欄上做文章,將以下代碼貼到地址欄運(yùn)行后瀏覽器變成了一個(gè)原始而簡(jiǎn)單的編輯器,與Windows自帶的notepad一樣,吼吼。
如下圖:
歸根結(jié)底多虧了HTML5中新加的contenteditable屬性,當(dāng)元素指定了該屬性后,元素的內(nèi)容成為可編輯狀態(tài)。
推而廣之,將以下代碼放到console執(zhí)行后,整個(gè)頁(yè)面將變得可編輯!
如下圖:
利用a標(biāo)簽自動(dòng)解析URL
很多時(shí)候我們有從一個(gè)URL中提取域名,查詢關(guān)鍵字,變量參數(shù)值等的需要,而萬(wàn)萬(wàn)沒(méi)想到可以讓瀏覽器方便地幫我們完成這一任務(wù)而不用我們寫正則去抓取。方法就在JS代碼里先創(chuàng)建一個(gè)a標(biāo)簽然后將需要解析的URL賦值給a的href屬性,然后就得到了一切我們想要的了。
如下圖:
用上面方法,對(duì)瀏覽器參數(shù)進(jìn)行操作!
頁(yè)面擁有ID的元素會(huì)創(chuàng)建全局變量
在一張HTML頁(yè)面中,所有設(shè)置了ID屬性的元素會(huì)在JavaScript的執(zhí)行環(huán)境中創(chuàng)建對(duì)應(yīng)的全局變量,這意味著document.getElementById像人的闌尾一樣顯得多余了。但實(shí)際項(xiàng)目中最好老老實(shí)實(shí)該怎么寫就怎么寫,畢竟常規(guī)代碼出亂子的機(jī)會(huì)要小得多。
如下圖:
加載CDN文件時(shí),可以省掉HTTP標(biāo)識(shí)
現(xiàn)在很流行的CDN即從專門的服務(wù)器加載一些通用的JS和CSS文件,出于安全考慮有的CDN服務(wù)器使用HTTPS方式連接,而有的是傳統(tǒng)的HTTP,其實(shí)我們?cè)谑褂脮r(shí)可以忽略掉這個(gè),將它從URL中省去。
利用script標(biāo)簽保存任意信息
將script標(biāo)簽設(shè)置為type='text'然后可以在里面保存任意信息,之后可以在JavaScript代碼中很方便地獲取。
當(dāng)然,冷知識(shí)遠(yuǎn)不止這些呢。
【相關(guān)推薦】
1. 免費(fèi)h5在線視頻教程
2. HTML5 完整版手冊(cè)
3. php.cn原創(chuàng)html5視頻教程
聲明:本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí),若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系,我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com