一、前言
什麼是doctype？其實我們一直使用，卻很少停下來看清楚它到底是什麼，對網頁有什麼作用。本篇將和大家一起**那個默默無聞的doctype吧！
二、什麼是doctype
doctype或dtd就是宣告在文件首行，位於前，用於告知瀏覽器該文件遵循那種級別的html或xhtml規範。
其宣告格式如下：
/p>
①html
②public
③"公共識別符號"
④"系統識別符號"⑤
⑥>
①. dotype固定的起始部分
②. 宣告文件以html標籤為根標籤
③. public用於表示第四部分是公共識別符號
④. 公共識別符號
⑤. 系統識別符號
⑥. 內部子集，html不常見，一般出現在xml中
三、doctype的種類
doctype有三種型別（strict、transitional和frameset）。strict是最為嚴格的型別，要求文件內容做到 樣式與資料完全分離，html標籤中不允許使用任何表現層屬性（如width等）；transitional為非常寬鬆的dtd，允許你繼續使用 html4.01的標籤，並且資料和樣式無需完全分離；frameset表文件會用到框架。
以xhtml為例：
strict
注意：由於在現實使用過程中，發現doctype最大的作用就是用於文件模式的切換，於是html5規範將doctype的宣告格式簡化 為，因此以後我們直接寫這個簡化版就好了。（「理論指導實踐，實踐驗證真理」被再一次驗證了）
五、documenttype型別
ie9+、ff、chrome和safari均支援documenttype型別，因此我們可以通過document.doctype獲取documenttype型別的dtd物件。若文件沒有宣告dtd，則返回null。
5.1. 獲取方式
除了通過document.doctype獲取外，還可以通過document.childnodes[0]來獲取。
5.2. 特點
不能動態cud，僅僅能通過該api獲取dtd資訊而已。
5.3. 屬性值
nodetype：10
nodename：文件型別的名稱（就是nodevalue：null
parentnode：htmldocument型別的元素物件（即是document）
parentelement：null
childnodes：空的nodelist
children：undefined
name：和nodename一樣
entities：描述實體，恆返回null（ie9+有該屬性，而chrome、ff直接刪除該屬性）
notations：描述符號，恆返回null（ie9+有該屬性，而chrome、ff直接刪除該屬性）
5.4. dom2、dom3新增的屬性
publicid：獲取公共標識
systemid：獲取系統標識
internalsubset：獲取內部子集
5.5. ie5678下的dtd節點的解析
由於ie5678沒有documenttype型別，因此document.doctype恆返回null。而通過document.childnodes[0]返回的是以注釋型別來解析dtd。
六、總結
看了這麼多，其實只需在以後開發的時候記得在文件首行加上就ok了，簡單了吧？
CSS魔法堂 那個被我們忽略的outline
在css魔法堂 改變單選框顏色就這麼吹毛求疵！中我們要模擬原生單選框通過tab鍵獲得焦點的效果，這裡涉及到乙個常常被忽略的屬性 outline，由於之前對其印象確實有些模糊，於是本文打算對其進行稍微深入的研究 用於建立可視物件的輪廓 元素的border box 如表單按鈕輪廓等。outline不佔文...
JS魔法堂 再識ASCII實體 符號實體和字元實體
一 前言 相信大家都熟悉通過字元實體 來實現多個連續空格的輸入吧！本文打算對三類html實體及js相關操作作進一步的整理和小結，若有紕漏請大家指正，謝謝。二 初識html實體 由於html中某些字元是預留的 如 和 等 若要在進行html解析出來後能正確顯示預留字元，則需要使用字元實體來代替了。字元...
JS魔法堂 關於元素位置和滑鼠位置的屬性
一 關於滑鼠位置的屬性 1.觸發滑鼠事件的區域 盒子模型中的border,padding,content區域會觸發滑鼠事件,點選margin區域將不觸發滑鼠事件。2.滑鼠事件物件mouseevent下的屬性 注意 1.ie5.5 8不支援該屬性，polyfill方法pagex clientx scr...