HTML DOM Document 對象


HTML DOM 節點

在 HTML DOM (Document Object Model) 中 , 每一個元素都是 節點:

  • 文檔是一個文檔節點。
  • 所有的HTML元素都是元素節點。
  • 所有 HTML 屬性都是屬性節點。
  • 文本插入到 HTML 元素是文本節點。are text nodes。
  • 注釋是注釋節點。

Document 對象

當瀏覽器載入 HTML 文檔, 它就會成為 Document 對象

Document 對象是 HTML 文檔的根節點。

Document 對象使我們可以從腳本中對 HTML 頁麵中的所有元素進行訪問。

提示:Document 對象是 Window 對象的一部分,可通過 window.document 屬性對其進行訪問。


瀏覽器支持

Internet ExplorerFirefoxOperaGoogle ChromeSafari

所有主要瀏覽器都支持 Document 對象。


Document 對象屬性和方法

HTML文檔中可以使用以下屬性和方法:

屬性 / 方法 描述
document.activeElement 返回當前獲取焦點元素
document.addEventListener() 向文檔添加句柄
document.adoptNode(node) 從另外一個文檔返回 adapded 節點到當前文檔。
document.anchors 返回對文檔中所有 Anchor 對象的引用。
document.applets

返回對文檔中所有 Applet 對象的引用。

注意: HTML5 已不支持 <applet> 元素。

document.baseURI 返回文檔的絕對基礎 URI
document.body 返回文檔的body元素
document.close() 關閉用 document.open() 方法打開的輸出流,並顯示選定的數據。
document.cookie 設置或返回與當前文檔有關的所有 cookie。
document.createAttribute() 創建一個屬性節點
document.createComment() createComment() 方法可創建注釋節點。
document.createDocumentFragment() 創建空的 DocumentFragment 對象,並返回此對象。
document.createElement() 創建元素節點。
document.createTextNode() 創建文本節點。
document.doctype 返回與文檔相關的文檔類型聲明 (DTD)。
document.documentElement 返回文檔的根節點
document.documentMode 返回用於通過瀏覽器渲染文檔的模式
document.documentURI 設置或返回文檔的位置
document.domain 返回當前文檔的域名。
document.domConfig 已廢棄返回 normalizeDocument() 被調用時所使用的配置。
document.embeds 返回文檔中所有嵌入的內容(embed)集合
document.forms 返回對文檔中所有 Form 對象引用。
document.getElementsByClassName() 返回文檔中所有指定類名的元素集合,作為 NodeList 對象。
document.getElementById() 返回對擁有指定 id 的第一個對象的引用。
document.getElementsByName() 返回帶有指定名稱的對象集合。
document.getElementsByTagName() 返回帶有指定標簽名的對象集合。
document.images 返回對文檔中所有 Image 對象引用。
document.implementation 返回處理該文檔的 DOMImplementation 對象。
document.importNode() 把一個節點從另一個文檔複製到該文檔以便應用。
document.inputEncoding 返回用於文檔的編碼方式(在解析時)。
document.lastModified 返回文檔被最後修改的日期和時間。
document.links 返回對文檔中所有 Area 和 Link 對象引用。
document.normalize() 刪除空文本節點,並連接相鄰節點
document.normalizeDocument() 刪除空文本節點,並連接相鄰節點的
document.open() 打開一個流,以收集來自任何 document.write() 或 document.writeln() 方法的輸出。
document.querySelector() 返回文檔中匹配指定的CSS選擇器的第一元素
document.querySelectorAll() document.querySelectorAll() 是 HTML5中引入的新方法,返回文檔中匹配的CSS選擇器的所有元素節點列表
document.readyState 返回文檔狀態 (載入中……)
document.referrer 返回載入當前文檔的文檔的 URL。
document.removeEventListener() 移除文檔中的事件句柄(由 addEventListener() 方法添加)
document.renameNode() 重命名元素或者屬性節點。
document.scripts 返回頁麵中所有腳本的集合。
document.strictErrorChecking 設置或返回是否強製進行錯誤檢查。
document.title 返回當前文檔的標題。
document.URL 返回文檔完整的URL
document.write() 向文檔寫 HTML 表達式 或 JavaScript 代碼。
document.writeln() 等同於 write() 方法,不同的是在每個表達式之後寫一個換行符。


警告 !!!

在 W3C DOM核心,文檔對象 繼承節點對象的所有屬性和方法。

很多屬性和方法在文檔中是沒有意義的。

HTML 文檔對象可以避免使用這些節點對象和屬性:

 屬性 / 方法 避免的原因
document.attributes 文檔沒有該屬性
document.hasAttributes() 文檔沒有該屬性
document.nextSibling 文檔沒有下一節點
document.nodeName 這個通常是 #document
document.nodeType 這個通常是 9(DOCUMENT_NODE)
document.nodeValue 文檔沒有一個節點值
document.ownerDocument 文檔沒有主文檔
document.ownerElement 文檔沒有自己的節點
document.parentNode 文檔沒有父節點
document.previousSibling 文檔沒有兄弟節點
document.textContent 文檔沒有文本節點