這篇文章主要介紹在HTML中引入外部頁(yè)面的方法,文中介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們一定要看完!
創(chuàng)新互聯(lián)公司長(zhǎng)期為超過千家客戶提供的網(wǎng)站建設(shè)服務(wù),團(tuán)隊(duì)從業(yè)經(jīng)驗(yàn)10年,關(guān)注不同地域、不同群體,并針對(duì)不同對(duì)象提供差異化的產(chǎn)品和服務(wù);打造開放共贏平臺(tái),與合作伙伴共同營(yíng)造健康的互聯(lián)網(wǎng)生態(tài)環(huán)境。為桐城企業(yè)提供專業(yè)的網(wǎng)站設(shè)計(jì)制作、成都網(wǎng)站建設(shè),桐城網(wǎng)站改版等技術(shù)服務(wù)。擁有十載豐富建站經(jīng)驗(yàn)和眾多成功案例,為您定制開發(fā)。
HTML imports提供了一種在一個(gè)HTML文檔中包含和重用另一個(gè)HTML文檔的方法。目前谷歌已經(jīng)全面支持HTML imports,Opera35版本之后支持,但是FF依舊不支持。(在谷歌的地址欄輸入:chrome://flags,啟動(dòng)或禁止一些功能) 。盡管目前HTML imports的兼容不是很好,但是我們還是有必要了解其使用方法,W3C已經(jīng)發(fā)布了HTML imports的標(biāo)準(zhǔn)草案,相信后期應(yīng)該還是會(huì)用得比較普遍的。使用HTML imports
<!doctype html> <html> <head> <!--網(wǎng)站編碼格式,UTF-8 國(guó)際編碼,GBK或 gb2312 中文編碼--> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <meta name="Keywords" content="關(guān)鍵詞一,關(guān)鍵詞二"> <meta name="Description" content="網(wǎng)站描述內(nèi)容"> <meta name="Author" content="Yvette Lau"> <title>Document</title> <link rel = "import" href = "test1.html"/> </head> <body> <div id = "content"></div> </body> </html> <script> var post = document.querySelector("link[rel = 'import']").import; var con = post.querySelector("div"); document.querySelector("#content").appendChild(con.cloneNode(true)); var clone = document.importNode(con,true) document.querySelector("#content").appendChild(clone) </script>
給出了兩種將import進(jìn)來的html中我們需要的部分插入到當(dāng)前html.
最后簡(jiǎn)單介紹document.querySelector和document.querySelectorAll,這兩個(gè)方法是HTML5在Web API中新引入的方法,大大簡(jiǎn)化了在原生Javascript代碼中選取元素。
document.querySelector和document.querySelectorAll都是接收一個(gè)字符串作為參數(shù),這個(gè)參數(shù)需要符合CSS選擇語法,即:標(biāo)簽、類選擇器、ID選擇器,屬性選擇器(E[type=”XX”]),結(jié)構(gòu)選擇器(:nth-child(n))等。不支持偽類選擇器。
document.importNode(node,deep)方法把一個(gè)節(jié)點(diǎn)從另一個(gè)文檔復(fù)制到該文檔以便應(yīng)用,第二個(gè)值為true,那么將該節(jié)點(diǎn)的所有子孫節(jié)點(diǎn)也復(fù)制過來。
node.cloneNode(deep):對(duì)已有的節(jié)點(diǎn)進(jìn)行克隆,deep值為true,表示克隆其子孫節(jié)點(diǎn)。如果deep為false,則只克隆該節(jié)點(diǎn)自身。
以上是在HTML中引入外部頁(yè)面的方法的所有內(nèi)容,感謝各位的閱讀!希望分享的內(nèi)容對(duì)大家有幫助,更多相關(guān)知識(shí),歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!
新聞標(biāo)題:在HTML中引入外部頁(yè)面的方法
標(biāo)題URL:http://redsoil1982.com.cn/article22/gcigcc.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站排名、營(yíng)銷型網(wǎng)站建設(shè)、軟件開發(fā)、網(wǎng)站建設(shè)、App設(shè)計(jì)、網(wǎng)站設(shè)計(jì)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)