DOM 中的節點和 object 有什么區別？

Question

在描述 DOM 樹時，我在網上找到的大多數資料都將 DOM 樹描述為由節點組成。

我發現這非常令人困惑，因為我認為 DOM 樹實際上只是瀏覽器運行時環境中內置的 JS 對象樹。

我的問題如下：

• DOM 樹真的只是由 ECMAScript 對象組成嗎？
• 這些對象如何連接以創建樹？ 例如，是否每個都有子屬性？
• Node 是一個實際的 object，其他對象原型鏈接到它嗎？ 例如，HTML 文檔中的元素在 DOM 樹中表示為 HTMLElement 構造函數 function (const foo = new HTMLElement()) 的實例，后者又 [[prototype]]-鏈接到 Element.prototype，后者反過來 [[prototype]]-鏈接到 Node.protoype？

Answer 1

DOM 樹真的只是由 ECMAScript 對象組成嗎？

號文件 Object Model 描述了通用對象，指定了它們的屬性和方法 model 一個文件。 它沒有說明這些對象是如何構造的，也沒有說明它們是用什么語言實現的。您會發現 DOM 實現是用 C++、Rust、Java、JavaScript 以及可能更多的語言編寫的。

這些對象如何連接以創建樹？ 例如，是否每個都有子屬性？

並非 DOM 中的所有對象都是樹節點，但對於那些是樹節點的對象，是的： childNodes和parentNode形成一棵樹。 nodeName 、nodeValue和attributes model 樹的內容。

Node 是一個實際的 object，其他對象原型鏈接到它嗎？

是的，DOM 的 ECMAScript 綁定（通過WebIDL ）規定節點表示為 ECMAScript 對象，帶有原型 inheritance 鏈用於Node等接口。

我認為 DOM 樹實際上只是瀏覽器運行時環境中內置的 JS 對象樹。

它們可能是原生 JS 對象，但最常見的是它們是包裝/代理瀏覽器內置 DOM 實現的宿主對象。 包裝器通常僅在訪問它們時由 getter 在現場構建，而不是在加載頁面時創建。