許多小伙伴在學(xué)習(xí)前端的時(shí)候會(huì)了解到什么是HTML,但在互聯(lián)網(wǎng)上沖浪的時(shí)候發(fā)現(xiàn)當(dāng)前前端技術(shù)最火的并不是HTML,而是H5。于是很多小伙伴就開始納悶了,到底什么是H5。其實(shí)啊,H5就是HTML5的意思,也就是第五代的HTML標(biāo)準(zhǔn)。那么如何區(qū)別HTML和HTML5呢?接下來小編告訴你。
先下結(jié)論,有<!doctype html>的都是H5
沒錯(cuò),因?yàn)檫@是官方規(guī)定的,哪怕你的文檔中夾雜著很多HTML5不再支持的代碼,那也是HTML5。一切的一切,都要從xml說起。
HTML和xml的關(guān)系
HTML被稱為超文本標(biāo)記語言,而xml則被稱為可拓展標(biāo)記語言,其實(shí)他們是一家,他們都來自一門叫SGML(標(biāo)準(zhǔn)通用標(biāo)記語言)。這門語言使用帶有尖括號(hào)的標(biāo)簽來標(biāo)記一些內(nèi)容,于是借鑒他們,提出了專門用于展示的HTML和專門給機(jī)器使用的xml。為什么要在一篇介紹html的文章里介紹xml呢?因?yàn)閔tml和xml是有相互借鑒的,其中HTML就有借鑒了xml的DTD,這個(gè)DTD就是確定HTML版本的關(guān)鍵。
關(guān)于xml和html,他們產(chǎn)生了一點(diǎn)交集,那就是XHTML,他具有XML的嚴(yán)格標(biāo)準(zhǔn)和HTML的表現(xiàn)力(其實(shí)本質(zhì)上還是html,只不過對標(biāo)簽的使用更加嚴(yán)格罷了)
HTML的DTD
DTD,中文解釋為文檔類型定義,在xml中用來定義標(biāo)簽的類型,而在早期的HTML中也存在這樣的DTD,以下是一些HTML的DTD,可以看到,DTD中會(huì)攜帶版本類型,通過這個(gè)版本類型可以知道當(dāng)前用的html是第幾代的HTML(但是HTML5是個(gè)特例,他直接使用?<!doctype html>
?)??梢院芎唵蔚膮^(qū)分出HTML和HTML5。
//用于XHTML 4.0 的嚴(yán)格型
<!DOCTYPE HTMLPUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
//用于XHTML 4.0 的過渡型
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
//用于XHTML 1.0 的嚴(yán)格型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
//用于XHTML 1.0 的過渡型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
HTML和H5的區(qū)別
從DTD上區(qū)分HTML和H5是一個(gè)簡單的方法,但有些開發(fā)者因?yàn)楦鞣N原因,可能沒有寫DTD(瀏覽器會(huì)按照默認(rèn)的方式去解析,比如如果瀏覽器默認(rèn)按h5解析的話,哪怕代碼是HTML4.0,也按照HTML5解析),又或者貪圖省事直接用H5的寫法進(jìn)行文檔聲明(HTML5是在之前的HTML基礎(chǔ)上添加了一些新的元素,所以兼容大部分的舊元素),這時(shí)候從DTD上就看不出了。其實(shí)還有一個(gè)最根本的方法。就是看標(biāo)簽。
DTD的作用是定義這個(gè)HTML文檔可以使用哪些標(biāo)簽,而接下來的這種方法也是同理。有些標(biāo)簽是H5獨(dú)有的(比如video,cavas,article),而有些標(biāo)簽是H5廢棄的(比如applet,center)。只要在代碼中找到這些標(biāo)簽,就可以確定代碼是不是HTML5。
- 有兩種特殊情況,一種是代碼里完全沒有出現(xiàn)這類特殊標(biāo)簽,即使用的標(biāo)簽是前后版本都有的,這種情況下你可以認(rèn)為它是h5,也可以認(rèn)為他是html4(或者其他版本),但是不能說他不是h5(因?yàn)槿思乙沧裱環(huán)5)。
- 另一種情況是代碼里兩種標(biāo)簽都有出現(xiàn),這種情況只能說明開發(fā)人員水平尚待提高,或者項(xiàng)目需要維護(hù)了。
- 關(guān)于HTML5新增與廢棄標(biāo)簽,可以參考HTML5參考手冊
小結(jié)
其實(shí)對于初學(xué)者而言并不用太多糾結(jié)html和html5的關(guān)系與區(qū)別,現(xiàn)在大多數(shù)的前端教程教授的都是HTML5,被廢棄的標(biāo)簽也很少見到了(雖然他們?nèi)匀豢梢陨?,雖然后端開發(fā)的時(shí)候偶爾用這種標(biāo)簽會(huì)比較輕松),所以并不用擔(dān)心自己學(xué)的是過時(shí)的技能,也不用擔(dān)心自己不會(huì)H5會(huì)不會(huì)影響到以后找工作。因?yàn)楫?dāng)你學(xué)習(xí)HTML5時(shí),你會(huì)發(fā)現(xiàn)——很多標(biāo)簽就是換了個(gè)名(標(biāo)簽語義化),實(shí)際要學(xué)的新標(biāo)簽只有一部分。等到這個(gè)時(shí)候,你就會(huì)發(fā)現(xiàn)為啥小編說不用糾結(jié)html和h5的區(qū)別了。
到HTML5基礎(chǔ)入門課程,了解更多H5知識(shí)。