摘要:標簽里有什么每一個文檔中,都有一個不可或缺的標簽,它作為一個容器,主要包含了用于描述文檔自身信息元數據的標簽,這些標簽一般不會在頁面中被顯示出來,大多情況下是給瀏覽器和搜索引擎看的。目前我只觀察到淘寶網使用了這個標簽。
head 標簽里有什么?
每一個 HTML 文檔中,都有一個不可或缺的標簽: ,它作為一個容器,主要包含了用于描述 HTML 文檔自身信息(元數據)的標簽,這些標簽一般不會在頁面中被顯示出來,大多情況下是給瀏覽器和搜索引擎看的。
可以用在 里面的標簽有:
定義文檔的標題,顯示在瀏覽器的標題欄或標簽頁上,一般會完整地概括整個網頁的內容。
給頁面上所有相對 URL 的提供一個基礎。一份文檔中只能有一個
目前我只觀察到「淘寶網」使用了這個標簽。
規定外部資源與當前文檔的關系,常于鏈接樣式表,如下所示:
當然還有很多其他的作用:
比如用于 SEO,主要給搜索引擎看的:
在網站中常有多個 url 指向同一個頁面的情況,上述標簽告知搜索引擎頁面的主 url 是什么,以便搜索引擎保留主要頁面而去除其他重復頁面。
提供 rss 訂閱的:
上述標簽除搜索引擎可以看懂以外,也能被很多瀏覽器插件識別。
表示頁面 icon 的:
多數瀏覽器會讀取這個 link 的資源并展示在頁面上。
對頁面提供預處理的:
提前對一個域名做 dns 查詢。強制對域名進行預讀取在有的情況下很有用,。
比如, 在網站的主頁上,強制在整個網站上對頻繁引用的域名做預解析處理,即使它們不在主頁本身上使用。雖然主頁的性能可能不受影響,但是會提高站點整體性能。
包含文檔的樣式信息。
一種通用的元數據信息表示標簽,一般以鍵值對出現,如:
charset 屬性從 HTML5 開始,上述寫法被推薦使用,用于聲明當前文檔所使用的字符編碼,推薦放在 中的第一位。
http-equiv屬性在 HTML4 中,上述代碼用于聲明字符集,但是現在已不被推薦。
除了 content-type ,還有其他幾個值:
content-language (已過時)、set-cookie (已過時)、default-style 、refresh 、content-security-policy
因為不常用,所以就不一一介紹了,也挺容易理解,感興趣可以點擊 這里 了解。
name 屬性其實 標簽可以被自由定義,只要讀取和寫入的雙方約定好 name 和 content 的格式就可以了。來看一個例子:
上面這種用法并不在 HTML 標準中,但是卻移動端開發的事實標準。這里來解釋一下 content 中的內容:
width :頁面寬度,可以是一個正整數;也可以一個字符串 "device-width" ,表示跟設備寬度相等。
height :頁面高度,可以是一個正整數;也可以一個字符串 "device-height" ,表示跟設備高度相等。
initial-scale :初始縮放比例。
minimum-scale : 最小縮放比例。
maximum-scale : 最大縮放比例。
user-scalable :是否允許用戶縮放。
name 屬性的值除了可以是 viewport 之外,還有相當多的值:
application-name 、author 、description 、generator 、keywords 、referrer 、robots 等。
同樣的,就不一一介紹了,感興趣可以點擊 這里 了解。
用于嵌入或引用可執行腳本。來看幾個 script 標簽常見的全局屬性:
async
使瀏覽器使用另一個線程下載腳本,這時不會阻塞頁面渲染。當腳本下載完成后,瀏覽器會暫停渲染,執行腳本,執行完畢后繼續渲染頁面。
async 無法保證腳本的執行順序,哪個腳本先下載結束就會先執行。
defer
同樣會使瀏覽器并行下載腳本,但是下載完畢不會立即執行,而是會等到 DOM 加載完成后(即剛剛讀取完 標簽)再執行腳本。
defer 可以保證腳本的執行順序就是它們在頁面上出現的順序。
src
定義引用外部腳本的地址,指定此屬性的 script 標簽內不應再有嵌入的腳本。如果腳本文件使用了非英語字符,還應該注明字符的編碼。如:
type
默認值是 text/javascript
想了解更多關于 標簽的詳細內容可以點擊 這里 。
如果頁面上的腳本類型不受支持或者當前在瀏覽器中關閉了腳本,則在此中定義腳本未被執行時的替代內容。
總結本文到這里就結束了,其實關于 link 和 meta 標簽還有很多沒有介紹到,很多相關標簽都是有特殊的需求,只有在特定情況下才會使用,比如移動端開發就會用許多在 PC 上并不需要的標簽。
當然平時使用也主要是看需求,就拿我目前來說,只是些許用到過一些與 viewport 和 SEO 相關的標簽。
鑒于此我推薦一個不錯的學習方法,就是去各大網站查看它們的 head 標簽里都有什么,遇到沒見過的就去搜索一下,熟悉起來會很快。
我這邊看過的網站有:「淘寶網」、「阿里巴巴」、「京東」、「網易嚴選」、「起點中文網」等。
(完)
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/53897.html
摘要:標簽里有什么每一個文檔中,都有一個不可或缺的標簽,它作為一個容器,主要包含了用于描述文檔自身信息元數據的標簽,這些標簽一般不會在頁面中被顯示出來,大多情況下是給瀏覽器和搜索引擎看的。目前我只觀察到淘寶網使用了這個標簽。 head 標簽里有什么? 每一個 HTML 文檔中,都有一個不可或缺的標簽: ,它作為一個容器,主要包含了用于描述 HTML 文檔自身信息(元數據)的標簽,這些標簽一般...
摘要:下面隆重介紹簡介是一個解析的第三方庫,它提供了一套非常方便的,可使用,以及類的操作方法來取出和操作數據。一個文檔的對象模型文檔由多個和組成其繼承結構如下繼承繼承繼承一個包含一個子節點集合,并擁有一個父。 前言 使用python寫爬蟲的人,應該都聽過beautifulsoup4這個包,用來它來解析網頁甚是方便。那么在java里有沒有類似的包呢?當然有啦!而且也非常好用。下面隆重介紹jso...
摘要:依賴信息是一個數組,比如上面的依賴數組是源碼如下是利用正則解析依賴的一個函數時間出發函數主要看這個部分注釋是防止拷貝該時間的回調函數,防止修改,困惑了一下。對的賦值需要同步執行,不能放在回調函數里。 sea.js想解決的問題 惱人的命名沖突 煩瑣的文件依賴 對應帶來的好處 Sea.js 帶來的兩大好處: 通過 exports 暴露接口。這意味著不需要命名空間了,更不需要全局變量。...
閱讀 2376·2021-09-30 09:47
閱讀 1367·2021-09-28 09:35
閱讀 3237·2021-09-22 15:57
閱讀 2485·2021-09-22 14:59
閱讀 3635·2021-09-07 10:25
閱讀 3069·2021-09-03 10:48
閱讀 3035·2021-08-26 14:14
閱讀 935·2019-08-30 15:55