在瀏覽器中,document對象是HTMLDocument對象(繼承於Document類型)的一個實例,表示整個頁面。
【子節點】
1.DocumentType(用document.doctype引用)
2.body(用document.body引用)
3.DocumentElement(指<HTML>,用document.documentElement引用)
4.Element
5.ProcessingInstruction
6.Comment
【屬性】
• document.title
• document.URL
• document.domain 域名
• document.head || document.getElementsByTagName("head")[0]
• document.referrer 來源頁面的URL
• document.charset 文檔字符集
• document.defaultCharset 默認瀏覽器和操作系統設置文檔默認的字符集
• document.anchors 包含所有帶name特性的a元素
• document.forms
• document.images
• document.links 包含所有帶link特性的a元素
• document.activeElement 引用DOM中當前獲得焦點的元素
• document.readyState 表明文檔加載情況
兩種值
- loading
- complete
• document.compatMode 表明瀏覽器採用哪種渲染模式
- 兩種模式
- CSS1Compat 標準模式
- BackCompat 混雜模式
• document.documentMode 表明頁面使用哪種文檔模式
• document.styleSheets[?] 取得第?個樣式表
• document.styleSheets[?].cssRules[??] or document.styleSheets[?].rules[??] 取得第?個樣式表的第??條規則
【方法】
• 查找元素 document.getElementById(id)
• 查找元素(返回0個或多個元素的NodeList)
document.getElementsByTagName(標籤名)
• 查找元素(返回帶特定name的所有元素,通常是取得單選按鈕)document.getElementsByName(name名)
• 查找元素 (返回NodeList)
Document.getElementsByClassName(類名)
X.getElementsByClassName(類名)
• 基於css選擇符,從DOM中獲取一個元素
document.querySelector() 會在文檔元素範圍內查找一個匹配的元素
X.querySelector() 會在元素後代的範圍內查找一個匹配的元素
• 基於css選擇符,從DOM中獲取所有匹配的元素(NodeList)
document.querySelectorAll()
X.querySelectorAll()
• 檢測是否有該選擇 X.matchesSelector(元素,選擇器)
• 創建屬性 document.createAttribute(屬性名)
• 創建元素 document.createElement(標籤名)
• 創建文本節點 document.createTextNode(文本)
• 創建註釋節點 document.createComment(註釋內容)
• 創建文檔片段 document.createDocumentFragment(要添加的文檔節點)
• 檢測文檔是否獲取焦點 document.hasFocus()
• document.write()
• document.writeln()
• document.open()
• document.close()
•確定瀏覽器是否支持該DOM模塊
document.implementation.hasFeature("DOM模塊名","版本號")
X.isSupported("DOM模塊名","版本號") 確定當前節點是否具有該DOM模塊的功能
•document.defaultView.getComputedStyle(元素,僞元素/null) 可獲得所有方式定義的樣式
{相比style對象的style.getPropertyValue(屬性名)只能獲得style特性,還包括嵌入的樣式表和外部樣式表}
【IE】: 元素.currentStyle