DOM2 Core     核心 在DOM1基礎上新增方法和屬性 DOM2 Views    檢視 基於樣式資訊的不同檢視 DOM2 Events    事件 與文件互動 DOM2 Style     樣式以程式設計的方式來訪問和改變CSS DOM2 Traverl and Range 遍歷和範圍 遍歷DOM DOM2 HTML     HTML 1級HTML上新增更多屬性

DOM變化（Core, HTML, Views, XML）

名稱空間：HTML不支援XML名稱空間

document.importNode(oldNode,true)方法，從文件複製一個節點

document.defaultView屬性，IE不可用。返回擁有給定文件的視窗或框架。(window )（IE用parentWindow）

document.implementation.createDocumentType("文件型別名",pubulicId,systemId) 建立一個文件型別節點。(建立新文件時有用)

document.implementation.createDocument("名稱空間URI","html","doctype") 建立一個新文件。

document.implementation.createHTMLDocument("文件標題")

document.body.isSupported("HTML","2.0")方法，檢測瀏覽器是否實現相應特性並且能夠基於給定節點執行該特性。

ele1.isSameNode(ele2)檢測2個節點是否引用同一個物件。

ele1.isEqualNode(ele2)檢測2個節點是否完全相等。

ele.setUserData("鍵","資料","處理函式")將資料指定給節點。（Chrome貌似不支援）。 處理函式接收5個引數：操作型別數值，資料鍵，資料值，源節點，目標節點。

iframe.contentDocument屬性 指向框架的文件物件。

樣式

(CSS)

檢測：var suport=document.implementtation.hasFeature("CSS","2.0")

1、style樣式 ele.style.fontFamily訪問、設定具體的CSS屬性（內聯樣式）使用駝峰式的屬性。 ele.style.cssText 訪問style中的程式碼。 ele.style.getPropertyValue("name") 返回給定屬性的字串值。 ele.style.removeProperty("name")刪除給定屬性。 ele.style.setProperty("name"，"value","important") 設定給定屬性的值，可以加上優先權標誌，不需要則空字串。 ele.style.getPropertyCSSValue 返回 cssText和cssValueType。（Chrome似乎無效）。

2、計算後的樣式（實際效果） document.defaultView.getComputedStyle(div,:after)取得計算後的樣式。第二個引數可省略。 IE用div.currentStyle。

操作樣式表（Chrome不支援）

var sheet = document.styleSheets      //取得樣式表集合（<link>/<style>的樣式表）
var rules = sheet[0].cssRules         //取得第一個樣式表內的規則集合，IE用rules
var rule = rules[0]                   //取得第一條規則
sheet[0].insertRules("規則文字"，索引) //新增規則，IE用addRule()
sheet[0]=deletRules(索引)             //刪除規則

元素大小

偏移量 ele.offsetWidth元素包括邊框在內的寬度(畫素) ele.offsetHeight元素包括邊框在內的高度(畫素) ele.offsetTop元素的上外邊框到包含他的元素的上內邊框的畫素距離 ele.offsetLeft元素的左外邊框到包含他的元素的左內邊框的畫素距離

客戶區大小 [不包含邊框。(內容+內邊距的大小)] 只讀 ele.clientWidth客戶區的寬 ele.clientHeight客戶區的高

document.documentElement.clientWidth        \\取得瀏覽器視口寬度
document.documentElement.clientHeight       \\取得瀏覽器視口高度

滾動大小 scrollHeight 元素原本的高度 scrollWidth 元素原本的寬度 scrollLeft 隱藏在內容區域左側的畫素數 scrollTop 隱藏在內容區域上方的畫素數 可以對父元素設定scrollLeft/scrollTop設定初始滾動位置

確定元素大小 使用ele.getBoundingClientRect ,返回一個矩形物件

遍歷

使用document.createNodeIterator()和document.createTreeWalker()。

document.createNodeIterator(document,NodeFilter.SHOW_ELEMENT,null,false)
//引數為: 起點元素, 節點型別, 過濾物件, 是否要擴充套件實體引用(false)

範圍

document.createRange()建立一個範圍物件