在進(jìn)行網(wǎng)站開發(fā)的時(shí)候，如何合理使用代碼標(biāo)簽讓網(wǎng)站建設(shè)更簡單?成都網(wǎng)站開發(fā)公司工作人員教你以下三個(gè)小技巧，讓前端開發(fā)更輕松。

一、a標(biāo)簽打開與刷新頁面標(biāo)簽作為常用標(biāo)簽，當(dāng)跳轉(zhuǎn)鏈接時(shí)，常用屬性target，

_self：默認(rèn)值。在相同的框架或窗口中載入目標(biāo)文檔。即當(dāng)前;

_blank：在一個(gè)新的未命名的窗口載入文檔。即新開窗口;

_parent：把文檔載入父窗口或包含了超鏈接引用的框架的框架集，如果沒有，則行為類似_self。即上級(jí)窗口中;

_top：把文檔載入包含該超鏈接的窗口,取代任何當(dāng)前正在窗口中顯示的框架。如果沒有上下文環(huán)境，則行為類似_self。即頂級(jí)窗口中。

不過，target屬性還有一個(gè)特征，可以自定義內(nèi)容或URL。

二、網(wǎng)頁一鍵換膚優(yōu)化實(shí)現(xiàn)將一個(gè)網(wǎng)頁的顏色相關(guān)一鍵切換

links[0].href = val

通過JS控制標(biāo)簽的href屬性切換引用的css文件

弊端：如果網(wǎng)站需要切換的內(nèi)容過多，每次引用CSS的加載會(huì)有一定量的延時(shí)，不具有流暢感，交互體驗(yàn)較差。

有趣的title屬性 在實(shí)現(xiàn)一鍵換膚的其他方法之前，要聊一下這個(gè)在標(biāo)簽中的title屬性。

當(dāng)標(biāo)簽具有title屬性且有值時(shí)，link標(biāo)簽就變成一個(gè)可控制的特殊元素，即可以通過DOM對象的disabled屬性控制link是否渲染。

但是，在實(shí)測過程中，除IE外無論link標(biāo)簽是否具有title屬性，都可以直接使用DOM對象的disabled屬性，但I(xiàn)E確實(shí)需要title。

let links = document.getElementsByTagName('link'); links = [].slice.call(links); links[0].disabled = true;

alternate備選 在標(biāo)簽中，rel屬性有很多值，常用的是stylesheet，但是還有一個(gè)alternate表示當(dāng)前文檔的替代版本，也就是加載但不執(zhí)行。

利用這個(gè)特性，結(jié)合DOM對象的disabled屬性，可以提前加載另一套css方案，解決交互性問題。代價(jià)是多一點(diǎn)點(diǎn)流量。

三、CSS矢量圖內(nèi)聯(lián)在前端項(xiàng)目中，使用到的圖標(biāo)類大多會(huì)使用SVG來實(shí)現(xiàn)，靜態(tài)文件的減少有利于性能的提升。當(dāng)然，可以用靜態(tài)資源緩存(blog鏈接)減少文件請求，高速渲染，引用地址使用內(nèi)聯(lián)，即直接將SVG放入路徑(不建議超級(jí)大圖，會(huì)極大增加文件體積)。

采用base64

采用標(biāo)簽直接內(nèi)聯(lián)

在直接引入之前，需要對一些特殊符號(hào)進(jìn)行轉(zhuǎn)譯"，%，#，{，}，<，>。(IE也兼容的!)

網(wǎng)站標(biāo)題：網(wǎng)站前端開發(fā)三個(gè)實(shí)用的小技巧
文章轉(zhuǎn)載：http://aaarwkj.com/news/84799.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供企業(yè)建站、做網(wǎng)站、網(wǎng)站建設(shè)、定制網(wǎng)站、網(wǎng)站設(shè)計(jì)、網(wǎng)站收錄

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)