成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

重學前端學習筆記(二十四)--HTML里的鏈接元素

CastlePeaK / 1451人閱讀

摘要:二標簽超鏈接型標簽超鏈接型標簽是一種被動型鏈接。四標簽與標簽非常相似,不同的是,它不是文本型的鏈接,而是區(qū)域型的鏈接。是整個規(guī)則中唯一支持非矩形熱區(qū)的標簽。

筆記說明
重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構(gòu)你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以加入winter的專欄學習【原文有winter的語音】,如有侵權(quán)請聯(lián)系我,郵箱:[email protected]。
一、介紹
鏈接是 HTML 中的一種機制,它是 HTML 文檔和其它文檔或者資源的連接關(guān)系。鏈接兩種類型:一種是超鏈接型標簽,一種是外部資源鏈接。

二、link 標簽 2.1、超鏈接型 link 標簽
超鏈接型 link 標簽是一種被動型鏈接。link 標簽具有特定的 rel 屬性,會成為特定類型的 link 標簽。
1、canonical 型 link
提示頁面它的主 URL,在網(wǎng)站中常常有多個 URL 指向同一頁面的情況,搜索引擎訪問這類頁面時會去掉重復(fù)的頁面,這個 link 會提示搜索引擎保留哪一個 URL。
2、alternate 型 link
提示頁面它的變形形式,就是當前頁面內(nèi)容的不同格式、不同語言或者為不同的設(shè)備設(shè)計的版本,也可以提供給搜索引擎來使用的。

典型應(yīng)用場景:頁面提供 rss 訂閱時

3、prev 型 link 和 next 型 link
用來告訴搜索引擎或者瀏覽器它的前一項和后一項,這有助于頁面的批量展示。
4、其它超鏈接類的 link

rel="author":鏈接到本頁面的作者,一般是 mailto: 協(xié)議

rel="help":鏈接到本頁面的幫助頁

rel="license":鏈接到本頁面的版權(quán)信息頁

rel="search":鏈接到本頁面的搜索頁面(一般是站內(nèi)提供搜索時使用)

2.2、外部資源類 link 標簽
外部資源型 link 標簽會被主動下載,并且根據(jù) rel 類型做不同的處理。
1、icon 型 link
唯一一個外部資源類的元信息 link,其它元信息類 link 都是超鏈接,icon 型 link 中的圖標地址默認會被瀏覽器下載和使用。

注意:多數(shù)瀏覽器會使用域名根目錄下的 favicon.ico,即使它并不存在,從性能的角度考慮,建議頁面中有 icon 型的 link。

2、預(yù)處理類 link
預(yù)處理類 link 標簽就是允許我們控制瀏覽器,提前針對一些資源去做這些操作,以提高性能(亂用性能反而更差)。

dns-prefetch 型:link 提前對一個域名做 dns 查詢

preconnect 型:link 提前對一個服務(wù)器建立 tcp 連接

prefetch 型:link 提前取 href 指定的 url 的內(nèi)容

preload 型:link 提前加載 href 指定的 url

prerender 型:link 提前渲染 href 指定的 url

3、modulepreload 型的 link
預(yù)先加載一個 JavaScript 的模塊,這樣能保證 JS 模塊不必等到執(zhí)行時才加載。所謂加載,是指完成下載并放入內(nèi)存,并不會執(zhí)行對應(yīng)的 JavaScript。




                
閱讀需要支付1元查看
<