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 屬性對其進行訪問。
瀏覽器支援
所有主要瀏覽器都支援 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 | 文件沒有文字節點 |