【EASYDOM系列教程】之Node介紹

oliverhuang 發布于2019-08-20 18:16 / 1443人閱讀

摘要：對象的作用樹結構主要是依靠節點進行解析，稱為節點樹結構。對象的繼承鏈關系對象是繼承于對象的，是一個用于接收事件的對象。但需要注明作者及來源，并且不能用于商業。本教程采用知識共享署名非商業性使用禁止演繹國際許可協議進行許可。

DOM 的標準規范中提供了 Node 對象，該對象主要提供了用于解析 DOM 節點樹結構的屬性和方法。

Node 對象的作用

DOM 樹結構主要是依靠節點進行解析，稱為 DOM 節點樹結構。Node 對象是解析 DOM 節點樹結構的主要入口。

Node 對象提供的屬性和方法，可以實現遍歷節點、插入節點和替換節點等操作。而這些操作也正是我們學習 Node 對象最為主要的目的。

Node 對象的繼承鏈關系

Node 對象是繼承于 EventTarget 對象的，EventTarget 是一個用于接收事件的對象。我們可以通過如下代碼測試兩者之間的繼承關系:

console.log(Node.prototype instanceof EventTarget);

DOM 的標準規范中的 Document 對象和 Element 對象（后面的章節要學習的內容）都是繼承于 Node 對象的。我們可以通過如下代碼測試它們之間的繼承關系:

console.log(Document.prototype instanceof Node);
console.log(Element.prototype instanceof Node);

測試 Node 對象

由于 Node 對象是 DOM 底層封裝的對象，所以我們并不能通過直接打印 Node 對象來查看其屬性或方法。

而是要通過打印 Node 對象的 prototype 原型屬性來查看其屬性或方法。

console.log(Node.prototype)

運行 HTML 頁面后，打開 開發者工具，我們可以看到以下內容:

本教程免費開源，任何人都可以免費學習、分享，甚至可以進行修改。但需要注明作者及來源，并且不能用于商業。

本教程采用知識共享署名-非商業性使用-禁止演繹 4.0 國際許可協議進行許可。

GPU云服務器云服務器系列之系列之二架構之坑系列 saas系列介紹

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/84266.html

【EASYDOM系列教程】之Document 對象介紹

摘要：對象的作用對象作為訪問和更新頁面內容的入口。這個結果充分地說明了對象在的標準規范中代表整個頁面。對象的繼承鏈對象是繼承于對象的。對象也是的標準規范中非常重要的對象之一，而對象又是繼承于對象。 Document 對象是 DOM 的標準規范中比較重要的對象之一。該對象提供了訪問和更新 HTML 頁面內容的屬性和方法。 Document 對象的作用 Document 對象作為 DOM 訪問和...

JiaXinYi 2019-08-21 11:48 評論0 收藏0
【EASYDOM系列教程】之復制節點

摘要：也就是說，它沒有父節點。如果參數設為，則不克隆它的任何子節點。為了防止一個文檔中出現兩個重復的元素使用方法克隆的節點在需要時應該指定另外一個與原值不同的。 Node 對象提供了 cloneNode() 方法實現 HTML 頁面中節點的復制功能。其語法結構如下: var dupNode = node.cloneNode(deep); 在上述語法結構中，調用 cloneNode() 方法的...

Panda 2019-08-21 11:50 評論0 收藏0
【EASYDOM系列教程】之判斷節點類型

摘要：對象中提供了和分別可以用于獲取指定節點的節點名稱節點類型和節點的值。具體的語法結構如下在上述語法結構中，是一個整數，其代表的是節點類型。本教程采用知識共享署名非商業性使用禁止演繹國際許可協議進行許可。 Node 對象中提供了 nodeName、nodeType 和 nodeValue 分別可以用于獲取指定節點的節點名稱、節點類型和節點的值。 DOM 節點樹結構中，我們實際開發最常見的節...

CocoaChina 2019-08-20 18:17 評論0 收藏0
【EASYDOM系列教程】之刪除節點

摘要：對象提供了方法實現從頁面中刪除指定節點。其語法結構如下在上述語法結構中，調用方法的表示參數的父節點，而參數則表示要刪除的那個節點。則用于存儲要刪除的節點的引用，即。 Node 對象提供了 removeChild() 方法實現從 HTML 頁面中刪除指定節點。其語法結構如下: var oldChild = node.removeChild(child); OR element.remov...

zzbo 2019-08-20 18:23 評論0 收藏0
【EASYDOM系列教程】索引

摘要：系列教程是一套免費開源，任何人都可以免費學習分享，甚至可以進行修改。本文是這套系列教程的索引也就是目錄第一回介紹在最開始，我們先來了解是什么的作用，以及瀏覽器的支持是怎么樣的。《EASYDOM》系列教程是一套免費、開源，任何人都可以免費學習、分享，甚至可以進行修改。但需要注明作者及來源，并且不能用于商業。本文是這套系列教程的索引（也就是目錄）: 第一回 DOM 介紹在最開始，我...

yanwei 2019-08-21 11:51 評論0 收藏0