href和src、link和@import的區(qū)別詳解

src與href的區(qū)別:

href(Hypertext Reference):超文本引用,常用的標(biāo)簽有l(wèi)ink、a等,用來(lái)鏈接引用的外部資源。在當(dāng)前元素或者當(dāng)前文檔和由當(dāng)前屬性定義的需要的錨點(diǎn)或資源之間定義一個(gè)鏈接或者關(guān)系,如:

<link href="style.css" rel="stylesheet" />

src(source):引入資源,引入的src的內(nèi)容是頁(yè)面必不可少的一部分。引入的內(nèi)容會(huì)嵌入當(dāng)前資源到當(dāng)前文檔元素定義的位置,常用的有:img、script、iframe等。如:

<script src="script.js"></script>

在瀏覽器下載、編譯、執(zhí)行這個(gè)文件之前頁(yè)面的加載和處理會(huì)被暫停(當(dāng)瀏覽器解析到該元素時(shí),會(huì)暫停瀏覽器的渲染),這也是建議把js文件放到底部加載的原因。img標(biāo)簽頁(yè)與此類似,瀏覽器暫停加載直到提取和加載圖像。

link和@import的區(qū)別:

兩者都是外部引用CSS的方式,但區(qū)別如下:

區(qū)別1:link是XHTML標(biāo)簽,除了加載CSS外,還可以定義RSS等其他事務(wù);@import屬于CSS范疇,只能加載CSS。

區(qū)別2:link引用CSS時(shí),在頁(yè)面載入時(shí)同時(shí)加載;@import需要頁(yè)面網(wǎng)頁(yè)完全載入以后加載。

區(qū)別3:link是XHTML標(biāo)簽,無(wú)兼容問(wèn)題;@import是在CSS2.1提出的,低版本的瀏覽器不支持。

區(qū)別4:link支持使用JavaScript控制DOM去改變樣式;而@import不支持。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 問(wèn)答題47 /72 常見瀏覽器兼容性問(wèn)題與解決方案? 參考答案 (1)瀏覽器兼容問(wèn)題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 14,154評(píng)論 1 92
  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 136,568評(píng)論 19 139
  • ?前端面試題匯總 一、HTML和CSS 21 你做的頁(yè)面在哪些流覽器測(cè)試過(guò)?這些瀏覽器的內(nèi)核分別是什么? ...
    Simon_s閱讀 2,372評(píng)論 0 8
  • HTML5面試題總結(jié)1.基礎(chǔ)問(wèn)題 = 和 == 和 === 的區(qū)別?= : 用于賦值 == : 用于判斷 === ...
    LorenaLu閱讀 1,400評(píng)論 0 4
  • 品牌:幣運(yùn)動(dòng) 產(chǎn)品名:智能運(yùn)動(dòng)手環(huán) 產(chǎn)品特點(diǎn):獨(dú)特的挖礦方式,移動(dòng)的運(yùn)動(dòng)礦機(jī) 運(yùn)動(dòng)記錄(計(jì)步器、卡路里燃燒、里程數(shù)...
    huili999閱讀 400評(píng)論 0 0

友情鏈接更多精彩內(nèi)容