1.HTML系枪、XML俺泣、XHTML 有什么區(qū)別

HTML

HTML含義：(HyperText Markup Language)超文本標(biāo)記語言。

“超文本”就是指頁面內(nèi)可以包含圖片、鏈接纱皆，甚至音樂、程序等非文字元素芭商，“標(biāo)記”是指用特定的標(biāo)記符號(hào)來標(biāo)記要顯示的內(nèi)容的各個(gè)部分派草。超文本標(biāo)記語言是標(biāo)準(zhǔn)通用標(biāo)記語言下的一個(gè)應(yīng)用，也是一種規(guī)范铛楣，一種標(biāo)準(zhǔn)近迁，它被設(shè)計(jì)用來顯示數(shù)據(jù)。HTML文本就是我們通常所說的網(wǎng)頁簸州，擴(kuò)展名可以是html或htm鉴竭。

HTML 是用來描述網(wǎng)頁的一種語言

• HTML 不是一種編程語言歧譬，而是一種標(biāo)記語言 (markup language)
• 標(biāo)記語言是一套標(biāo)記標(biāo)簽 (markup tag)
• HTML 使用標(biāo)記標(biāo)簽來描述網(wǎng)頁

XML

• XML含義：(Extensible Markup Language)，可擴(kuò)展標(biāo)記語言搏存。

XML是標(biāo)準(zhǔn)通用標(biāo)記語言的子集瑰步，是一種用于標(biāo)記電子文件使其具有結(jié)構(gòu)性的標(biāo)記語言，它被設(shè)計(jì)用來傳輸和存儲(chǔ)數(shù)據(jù)璧眠，是對(duì)超文本標(biāo)記語言的補(bǔ)充缩焦。可擴(kuò)展標(biāo)記語言是一種元標(biāo)記語言责静，即定義了用于定義其他特定領(lǐng)域有關(guān)語義的袁滥、結(jié)構(gòu)化的標(biāo)記語言，這些標(biāo)記語言將文檔分成許多部件并對(duì)這些部件加以標(biāo)識(shí)灾螃。它能夠更精確地聲明內(nèi)容题翻，方便跨越多種平臺(tái)的更有意義的搜索結(jié)果。它提供了一種描述結(jié)構(gòu)數(shù)據(jù)的格式腰鬼，簡(jiǎn)化了網(wǎng)絡(luò)中數(shù)據(jù)交換和表示嵌赠，使得代碼、數(shù)據(jù)和表示分離垃喊，并作為數(shù)據(jù)交換的標(biāo)準(zhǔn)格式猾普，因此它常被稱為智能數(shù)據(jù)文檔，文件擴(kuò)展名為xml本谜。

• XML 是一種標(biāo)記語言初家，很類似 HTML
• XML 的設(shè)計(jì)宗旨是傳輸數(shù)據(jù)，而非顯示數(shù)據(jù)
• XML 標(biāo)簽沒有被預(yù)定義乌助。您需要自行定義標(biāo)簽溜在。
• XML 被設(shè)計(jì)為具有自我描述性。
• XML 是 W3C 的推薦標(biāo)準(zhǔn)

XML與HTML之間的差異

它不是超文本標(biāo)記語言的替代他托。

它是對(duì)超文本標(biāo)記語言的補(bǔ)充掖肋。

它和超文本標(biāo)記語言為不同的目的而設(shè)計(jì)：

• 它被設(shè)計(jì)用來傳輸和存儲(chǔ)數(shù)據(jù)，其焦點(diǎn)是數(shù)據(jù)的內(nèi)容赏参。

• 超文本標(biāo)記語言被設(shè)計(jì)用來顯示數(shù)據(jù)志笼，其焦點(diǎn)是數(shù)據(jù)的外觀。

超文本標(biāo)記語言旨在顯示信息把篓，而它旨在傳輸信息纫溃。

對(duì)它最好的描述是：它是獨(dú)立于軟件和硬件的信息傳輸工具。

XML的用途

• XML 把數(shù)據(jù)從 HTML 分離

如果你需要在 HTML 文檔中顯示動(dòng)態(tài)數(shù)據(jù)韧掩，那么每當(dāng)數(shù)據(jù)改變時(shí)將花費(fèi)大量的時(shí)間來編輯 HTML紊浩。

通過 XML，數(shù)據(jù)能夠存儲(chǔ)在獨(dú)立的 XML 文件中。這樣你就可以專注于使用 HTML 進(jìn)行布局和顯示坊谁，并確保修改底層數(shù)據(jù)不再需要對(duì) HTML 進(jìn)行任何的改變费彼。

通過使用幾行 JavaScript，你就可以讀取一個(gè)外部 XML 文件口芍，然后更新 HTML 中的數(shù)據(jù)內(nèi)容箍铲。

• XML 簡(jiǎn)化數(shù)據(jù)共享

在真實(shí)的世界中，計(jì)算機(jī)系統(tǒng)和數(shù)據(jù)使用不兼容的格式來存儲(chǔ)數(shù)據(jù)鬓椭。

XML 數(shù)據(jù)以純文本格式進(jìn)行存儲(chǔ)虹钮，因此提供了一種獨(dú)立于軟件和硬件的數(shù)據(jù)存儲(chǔ)方法。

這讓創(chuàng)建不同應(yīng)用程序可以共享的數(shù)據(jù)變得更加容易膘融。

• XML 簡(jiǎn)化數(shù)據(jù)傳輸

通過 XML，可以在不兼容的系統(tǒng)之間輕松地交換數(shù)據(jù)祭玉。

對(duì)開發(fā)人員來說氧映，其中一項(xiàng)最費(fèi)時(shí)的挑戰(zhàn)一直是在因特網(wǎng)上的不兼容系統(tǒng)之間交換數(shù)據(jù)。

由于可以通過各種不兼容的應(yīng)用程序來讀取數(shù)據(jù)脱货，以 XML 交換數(shù)據(jù)降低了這種復(fù)雜性岛都。

• XML 簡(jiǎn)化平臺(tái)的變更

升級(jí)到新的系統(tǒng)（硬件或軟件平臺(tái)），總是非常費(fèi)時(shí)的振峻。必須轉(zhuǎn)換大量的數(shù)據(jù)臼疫，不兼容的數(shù)據(jù)經(jīng)常會(huì)丟失。

XML 數(shù)據(jù)以文本格式存儲(chǔ)扣孟。這使得 XML 在不損失數(shù)據(jù)的情況下烫堤，更容易擴(kuò)展或升級(jí)到新的操作系統(tǒng)、新應(yīng)用程序或新的瀏覽器凤价。

• XML 使您的數(shù)據(jù)更有用

由于 XML 獨(dú)立于硬件鸽斟、軟件以及應(yīng)用程序，XML 使您的數(shù)據(jù)更可用利诺，也更有用富蓄。

不同的應(yīng)用程序都能夠訪問您的數(shù)據(jù)，不僅僅在 HTML 頁中慢逾，也可以從 XML 數(shù)據(jù)源中進(jìn)行訪問立倍。

通過 XML，您的數(shù)據(jù)可供各種閱讀設(shè)備使用（手持的計(jì)算機(jī)侣滩、語音設(shè)備口注、新聞閱讀器等），還可以供盲人或其他殘障人士使用胜卤。

• XML 用于創(chuàng)建新的 Internet 語言
  很多新的 Internet 語言是通過 XML 創(chuàng)建的：
  其中的例子包括：

• XHTML - 最新的 HTML 版本

• WSDL - 用于描述可用的 web service

• WAP 和 WML - 用于手持設(shè)備的標(biāo)記語言

• RSS - 用于 RSS feed 的語言

• RDF 和 OWL - 用于描述資源和本體

• SMIL - 用于描述針針對(duì) web 的多媒體

XHTML

• XHTML含義：可擴(kuò)展標(biāo)記語言（Extensible HyperText Markup Language疆导，簡(jiǎn)稱：XHTML）

XHTML基于可擴(kuò)展標(biāo)記語言（XML）。XHTML就是一個(gè)扮演著類似HTML的角色的可擴(kuò)展標(biāo)記語言（XML），所以澈段，本質(zhì)上說悠菜，XHTML是一個(gè)過渡技術(shù)，結(jié)合了部分XML的強(qiáng)大功能及大多數(shù)HTML的簡(jiǎn)單特性败富。XHTML 1.0是一種在HTML 4.0基礎(chǔ)上優(yōu)化和改進(jìn)的的新語言悔醋，目的是基于XML應(yīng)用。XHTML是一種增強(qiáng)了的HTML,XHTML 是更嚴(yán)謹(jǐn)更純凈的 HTML 版本兽叮。它的可擴(kuò)展性和靈活性將適應(yīng)未來網(wǎng)絡(luò)應(yīng)用更多的需求芬骄。XML雖然數(shù)據(jù)轉(zhuǎn)換能力強(qiáng)大，完全可以替代HTML鹦聪，但面對(duì)成千上萬已有的基于HTML語言設(shè)計(jì)的網(wǎng)站账阻，直接采用XML還為時(shí)過早。因此泽本，在HTML4.0的基礎(chǔ)上淘太，用XML的規(guī)則對(duì)其進(jìn)行擴(kuò)展，得到了XHTML规丽。所以蒲牧，建立XHTML的目的就是實(shí)現(xiàn)HTML向XML的過渡。XHTML 于2000年的1月26日成為 W3C （World Wide Web Consortium 赌莺，萬維網(wǎng)聯(lián)盟）冰抢，文件擴(kuò)展名為xhtml.。

XHTML 是更嚴(yán)格更純凈的 HTML 代碼

• XHTML 的目標(biāo)是取代 HTML艘狭。
• XHTML 與 HTML 4.01 幾乎是相同的挎扰。
• XHTML 是更嚴(yán)格更純凈的 HTML 版本。
• XHTML 是作為一種 XML 應(yīng)用被重新定義的 HTML巢音。
• XHTML 是一個(gè) W3C 標(biāo)準(zhǔn)鼓鲁。

為什么要使用XHTML？

XHTML是當(dāng)前HTML版的繼承者港谊。HTML語法要求比較松散骇吭，這樣對(duì)網(wǎng)頁編寫者來說，比較方便歧寺，但對(duì)于機(jī)器來說燥狰，語言的語法越松散，處理起來就越困難斜筐，對(duì)于傳統(tǒng)的計(jì)算機(jī)來說龙致，還有能力兼容松散語法，但對(duì)于許多其他設(shè)備顷链，比如手機(jī)目代，難度就比較大。因此產(chǎn)生了由DTD定義規(guī)則，語法要求更加嚴(yán)格XHTML榛了。大部分常見的瀏覽器都可以正確地解析XHTML在讶，即使早期的瀏覽器，XHTML作為HTML的一個(gè)子集霜大，許多也可以解析构哺。也就是說，幾乎所有的網(wǎng)頁瀏覽器在正確解析HTML的同時(shí)战坤，也可兼容XHTML曙强。當(dāng)然，從HTML完全轉(zhuǎn)移到XHTML途茫，還需要一個(gè)過程碟嘴。

HTML與XHTML的區(qū)別

• XHTML 元素必須被正確地嵌套。
• XHTML 元素必須被關(guān)閉囊卜。
• 標(biāo)簽名必須用小寫字母臀防。
• XHTML 文檔必須擁有根元素。

總結(jié)

• HTML边败、XML、XHTML都是標(biāo)記語言
• HTML關(guān)注網(wǎng)頁內(nèi)容的展現(xiàn)
• XML關(guān)注數(shù)據(jù)的準(zhǔn)確捎废，語法嚴(yán)格笑窜，用于數(shù)據(jù)傳輸
• XHTML將XML的嚴(yán)謹(jǐn)性和HTML的簡(jiǎn)便性結(jié)合，適應(yīng)更加靈活多變的網(wǎng)頁需求

2.怎么理解HTML語義化登疗？

語義化是指用合理HTML標(biāo)記以及其特有的屬性去格式化文檔內(nèi)容排截。通俗地講,語義化就是對(duì)數(shù)據(jù)和信息進(jìn)行處理,使得機(jī)器可以理解。

也就是說辐益，用html中的標(biāo)簽断傲，讓整個(gè)網(wǎng)頁有一定的格式，機(jī)器在理解是智政，遇到某個(gè)標(biāo)簽认罩，知道這部分是做什么的。

語義化的優(yōu)點(diǎn)
1.為了在沒有css代碼時(shí)续捂，也能呈現(xiàn)很好的內(nèi)容結(jié)構(gòu)垦垂，代碼結(jié)構(gòu)，以至于達(dá)到?jīng)]有編程基礎(chǔ)的非技術(shù)人員牙瓢，也能看懂一二劫拗。（其實(shí)，就是為了不穿CSS外衣矾克，裸奔依然好看）页慷。
2.提高用戶體驗(yàn)，比如：title，alt用于解釋名詞和圖片信息酒繁。
3.利于SEO滓彰，語義化能和搜索引擎建立良好的聯(lián)系，有利于爬蟲抓取更多的有效信息欲逃。爬蟲依賴于標(biāo)簽來確定上下文和各個(gè)關(guān)鍵字的權(quán)重找蜜。
4.方便其他設(shè)備解析（如屏幕閱讀器、盲人閱讀器稳析、移動(dòng)設(shè)備）以語義的方式來渲染網(wǎng)頁洗做。
5.便于團(tuán)隊(duì)開發(fā)和維護(hù)，語義化更具可讀性彰居，如果遵循W3C標(biāo)準(zhǔn)的團(tuán)隊(duì)都遵循這個(gè)標(biāo)準(zhǔn)诚纸，可以減少差異化，利于規(guī)范化陈惰。

3.怎樣理解內(nèi)容與樣式分離原則畦徘？

• 寫HTML的時(shí)候先不管樣式，重點(diǎn)放在HTML的結(jié)構(gòu)和語義化上抬闯，讓HTML能體現(xiàn)頁面結(jié)構(gòu)或者內(nèi)容井辆。樣式交給CSS完成，交互交給JS完成
• 寫JS的時(shí)候溶握，盡量不要用JS去直接操作樣式杯缺，而是通過給元素添加刪除class來控制樣式變化
• HTML內(nèi)不允許出現(xiàn)屬性樣式，盡量不要出現(xiàn)行內(nèi)樣式睡榆。

4.有哪些常見的meta標(biāo)簽萍肆？

<meta>標(biāo)簽

• <meta> 元素可提供有關(guān)頁面的元信息（meta-information），比如針對(duì)搜索引擎和更新頻度的描述和關(guān)鍵詞胀屿。

• <meta> 標(biāo)簽位于文檔的頭部塘揣，不包含任何內(nèi)容。<meta> 標(biāo)簽的屬性定義了與文檔相關(guān)聯(lián)的名稱/值對(duì)宿崭。

  
  
  image.png

<meta charset='xxx'>：告訴瀏覽器器亲铡，當(dāng)前頁面采用的編碼方式。

name屬性

name屬性主要用于描述網(wǎng)頁葡兑，與之對(duì)應(yīng)的屬性值為content奴愉，content中的內(nèi)容主要是便于搜索引擎機(jī)器人查找信息和分類信息用的。

格式：<meta name="參數(shù)"content="具體的參數(shù)值">铁孵。

1.Keywords(關(guān)鍵字):告訴搜索引擎你網(wǎng)頁的關(guān)鍵字是什么锭硼。
<meta name="keywords"content="meta總結(jié),html meta,meta屬性,meta跳轉(zhuǎn)">

2.description(網(wǎng)站內(nèi)容描述):用來告訴搜索引擎你的網(wǎng)站主要內(nèi)容。
<meta name="description"content="xxx博客,html的meta總結(jié)蜕劝，meta是html語言head區(qū)的一個(gè)輔助性標(biāo)簽檀头。">

3.robots(機(jī)器人向?qū)?:告訴搜索機(jī)器人哪些頁面需要索引轰异，哪些頁面不需要索引。
<meta name="robots"content="none">
可選擇參數(shù)

• 信息參數(shù)為all：文件將被檢索暑始，且頁面上的鏈接可以被查詢

• 信息參數(shù)為none：文件將不被檢索搭独，且頁面上的鏈接不可以被查詢

• 信息參數(shù)為index：文件將被檢索

• 信息參數(shù)為follow：頁面上的鏈接可以被查詢

• 信息參數(shù)為noindex：文件將不被檢索，但頁面上的鏈接可以被查詢

• 信息參數(shù)為nofollow：文件將被檢索廊镜，但頁面上的鏈接不可以被查詢

4.author(作者)：標(biāo)注網(wǎng)頁的作者
<meta name="author"content="root,root@xxxx.com">

5.generator:明網(wǎng)站的采用的什么軟件制作牙肝。
<meta name="generator"content="信息參數(shù)"/>

6.COPYRIGHT:代表說明網(wǎng)站版權(quán)信息。
<META NAME="COPYRIGHT"CONTENT="信息參數(shù)">

7.revisit-after:代表網(wǎng)站重訪,7days代表7天嗤朴，依此類推配椭。
<META name="revisit-after"CONTENT="7days">

http-equiv屬性

相當(dāng)于http的文件頭作用，它可以向?yàn)g覽器傳回一些有用的信息雹姊，以幫助正確和精確地顯示網(wǎng)頁內(nèi)容股缸，與之對(duì)應(yīng)的屬性值為content，content中的內(nèi)容其實(shí)就是各個(gè)參數(shù)的變量值吱雏。

格式：<meta http-equiv="參數(shù)"content="參數(shù)變量值">

1.Expires(期限):可以用于設(shè)定網(wǎng)頁的到期時(shí)間敦姻。一旦網(wǎng)頁過期，必須到服務(wù)器上重新傳輸歧杏。
<meta http-equiv="expires"content="Fri,12Jan200118:18:18GMT">
PS:必須使用GMT的時(shí)間格式镰惦。

2.Pragma(cache模式):禁止瀏覽器從本地計(jì)算機(jī)的緩存中訪問頁面內(nèi)容。訪問者無法脫機(jī)瀏覽
<meta http-equiv="Pragma"content="no-cache">

3.Refresh(刷新):自動(dòng)刷新并指向新頁面犬绒。
<meta http-equiv="Refresh"content="2;URL=http://www.xxx.com">
PS:注意后面的引號(hào)旺入，分別在秒數(shù)的前面和網(wǎng)址的后面,例子中為2秒后刷新到url的網(wǎng)址

4.Set-Cookie(cookie設(shè)定)：如果網(wǎng)頁過期，那么存盤的cookie將被刪除懂更。
<meta http-equiv="Set-Cookie"content="cookie value=xxx;expires=Friday,12-Jan-200118:18:18GMT；path=/">
PS:必須使用GMT的時(shí)間格式急膀。

5.Window-target(顯示窗口的設(shè)定):強(qiáng)制頁面在當(dāng)前窗口以獨(dú)立頁面顯示沮协。
<meta http-equiv="Window-target"content="_top">
PS:用來防止別人在框架里調(diào)用自己的頁面。

6.content-Type(顯示字符集的設(shè)定):設(shè)定頁面使用的字符集卓嫂。
<meta http-equiv="content-Type"content="text/html;charset=gb2312">
不同參數(shù)
meta標(biāo)簽的charset的信息參數(shù)如GB2312時(shí)慷暂，代表說明網(wǎng)站是采用的編碼是簡(jiǎn)體中文

meta標(biāo)簽的charset的信息參數(shù)如BIG5時(shí)，代表說明網(wǎng)站是采用的編碼是繁體中文

meta標(biāo)簽的charset的信息參數(shù)如iso-2022-jp時(shí)，代表說明網(wǎng)站是采用的編碼是日文

meta標(biāo)簽的charset的信息參數(shù)如ks_c_5601時(shí)，代表說明網(wǎng)站是采用的編碼是韓文

meta標(biāo)簽的charset的信息參數(shù)如ISO-8859-1時(shí)丹壕，代表說明網(wǎng)站是采用的編碼是英文

meta標(biāo)簽的charset的信息參數(shù)如UTF-8時(shí)踢代，代表世界通用的語言編碼

7.content-Language（顯示語言的設(shè)定）
<meta http-equiv="Content-Language"content="zh-cn"/>

8.http-equiv="imagetoolbar":指定是否顯示圖片工具欄，當(dāng)為false代表不顯示耳幢，當(dāng)為true代表顯示。
<meta http-equiv="imagetoolbar"content="false"/>

9.Content-Script-Type:W3C網(wǎng)頁規(guī)范，指明頁面中腳本的類型氧吐。
<Meta http-equiv="Content-Script-Type"Content="text/javascript">

**10.Pics-label(網(wǎng)頁等級(jí)評(píng)定) **:在IE的internet選項(xiàng)中有一項(xiàng)內(nèi)容設(shè)置讹蘑，可以防止瀏覽一些受限制的網(wǎng)站，而網(wǎng)站的限制級(jí)別就是通過meta屬性來設(shè)置的筑舅。
`<meta http-equiv="Pics-label" content=""> ·

5.文檔聲明的作用座慰？嚴(yán)格模式和混雜模式指什么?<!doctype html> 的作用?

• 文檔聲明的作用：告知瀏覽器的解析器， 用什么 文檔類型規(guī)范 來解析這個(gè)文檔翠拣。
• 嚴(yán)格模式和混雜模式
  嚴(yán)格模式：標(biāo)準(zhǔn)模式版仔，瀏覽器使用W3C的標(biāo)準(zhǔn)解析渲染頁面。
  混雜模式：瀏覽器使用自己的怪異模式解析渲染頁面误墓。
• <!doctype html> 的作用：

它是html5標(biāo)準(zhǔn)網(wǎng)頁聲明,全稱為Document Type HyperText Mark-up Language蛮粮，意思為文檔種類為超文本標(biāo)記性語言或超文本鏈接標(biāo)示語言，現(xiàn)在是這個(gè)簡(jiǎn)潔形式优烧，支持html5標(biāo)準(zhǔn)的主流瀏覽器都認(rèn)識(shí)這個(gè)聲明蝉揍。表示網(wǎng)頁采用html5，<!DOCTYPE> 聲明位于文檔中的最前面的位置畦娄，處于 <html> 標(biāo)簽之前又沾。此標(biāo)簽可告知瀏覽器文檔使用哪種 HTML 或 XHTML 規(guī)范。

6.瀏覽器亂碼的原因是什么熙卡？如何解決杖刷？

• 保存的編碼格式和瀏覽器解析時(shí)的解碼格式不匹配導(dǎo)致的。
• 在保存文件時(shí)驳癌，charset的屬性值與當(dāng)前頁面保持一致

7.常見的瀏覽器有哪些滑燃？使用什么內(nèi)核？

• 常見內(nèi)核：Trident颓鲜、Gecko表窘、Webkit、Blink甜滨。
  常見瀏覽器
• IE: trident內(nèi)核（IE6~IE11）
• Chrome:Blink(基于webkit乐严，Google與Opera Software共同開發(fā))
• Firefox：gecko內(nèi)核
• Safari:webkit內(nèi)核
• Opera:以前是presto內(nèi)核，Opera現(xiàn)已改用Google Chrome的Blink內(nèi)核
• 360安全瀏覽器：1.0-5.0為Trident衣摩，6.0為Trident+Webkit昂验，7.0為Trident+Blink
• 360極速瀏覽器：7.5之前為Trident+Webkit,7.5為Trident+Blink
• QQ瀏覽器：Chromium內(nèi)核+IE雙內(nèi)核

8.常見html標(biāo)簽及使用場(chǎng)景

常見的html標(biāo)簽