成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

【EASYDOM系列教程】之判斷節(jié)點類型

CocoaChina / 2178人閱讀

摘要：對象中提供了和分別可以用于獲取指定節(jié)點的節(jié)點名稱節(jié)點類型和節(jié)點的值。具體的語法結(jié)構(gòu)如下在上述語法結(jié)構(gòu)中，是一個整數(shù)，其代表的是節(jié)點類型。本教程采用知識共享署名非商業(yè)性使用禁止演繹國際許可協(xié)議進(jìn)行許可。

Node 對象中提供了 nodeName、nodeType 和 nodeValue 分別可以用于獲取指定節(jié)點的節(jié)點名稱、節(jié)點類型和節(jié)點的值。

DOM 節(jié)點樹結(jié)構(gòu)中，我們實際開發(fā)最常見的節(jié)點有:

節(jié)點名稱 含義
元素節(jié)點 表示 HTML 頁面中的標(biāo)簽（即 HTML 頁面的結(jié)構(gòu)）
屬性節(jié)點 表示 HTML 頁面中的開始標(biāo)簽包含的屬性
文本節(jié)點 表示 HTML 頁面中的標(biāo)簽所包含的文本內(nèi)容
nodeName 屬性

Node 對象的 nodeName 屬性用于獲取指定節(jié)點的節(jié)點名稱。具體的語法結(jié)構(gòu)如下:

var str = node.nodeName;

在上述語法結(jié)構(gòu)中，str 是一個存儲了當(dāng)前節(jié)點的節(jié)點名稱的字符串。

值得注意的是: nodeName 是一個只讀屬性。

針對不同的節(jié)點類型，nodeName 返回的節(jié)點名稱是不同的:

節(jié)點類型 nodeName 屬性的值
Document 文檔節(jié)點 "#document"
Element 元素節(jié)點 元素節(jié)點的元素名
Attr 屬性節(jié)點 屬性節(jié)點的屬性名
Text 文本節(jié)點 "#text"

如下代碼示例，測試元素節(jié)點、屬性節(jié)點和文本節(jié)點的 nodeName 的值:

// 獲取元素節(jié)點
var elemNode = document.getElementById("btn");
// 獲取屬性節(jié)點
var attrNode = elemNode.getAttributeNode("title");
// 獲取文本節(jié)點
var textNode = elemNode.firstChild;

console.log("元素節(jié)點的nodeName: " + elemNode.nodeName);
console.log("屬性節(jié)點的nodeName: " + attrNode.nodeName);
console.log("文本節(jié)點的nodeName: " + textNode.nodeName);
nodeType 屬性

Node 對象的 nodeType 屬性用于獲取指定節(jié)點的節(jié)點類型。具體的語法結(jié)構(gòu)如下:

var type = node.nodeType;

在上述語法結(jié)構(gòu)中，type 是一個整數(shù)，其代表的是節(jié)點類型。

針對不同的節(jié)點類型，nodeType 返回的節(jié)點類型是不同的:

節(jié)點類型 nodeType 屬性的值
Document 文檔節(jié)點 9
Element 元素節(jié)點 1
Attr 屬性節(jié)點 2
Text 文本節(jié)點 3

如下代碼示例，測試元素節(jié)點、屬性節(jié)點和文本節(jié)點的 nodeType 的值:

// 獲取元素節(jié)點
var elemNode = document.getElementById("btn");
// 獲取屬性節(jié)點
var attrNode = elemNode.getAttributeNode("title");
// 獲取文本節(jié)點
var textNode = elemNode.firstChild;

console.log("元素節(jié)點的nodeType: " + elemNode.nodeType);
console.log("屬性節(jié)點的nodeType: " + attrNode.nodeType);
console.log("文本節(jié)點的nodeType: " + textNode.nodeType);
nodeValue 屬性

Node 對象的 nodeValue 屬性用于獲取指定節(jié)點的節(jié)點值。具體的語法結(jié)構(gòu)如下:

var value = node.nodeValue;

在上述語法結(jié)構(gòu)中，value 是一個包含當(dāng)前節(jié)點的值的字符串。

針對不同的節(jié)點類型，nodeValue 返回的節(jié)點類型是不同的:

節(jié)點類型 nodeValue 屬性的值
Document 文檔節(jié)點 null
Element 元素節(jié)點 null
Attr 屬性節(jié)點 屬性節(jié)點的屬性值
Text 文本節(jié)點 文本節(jié)點的內(nèi)容

如下代碼示例，測試元素節(jié)點、屬性節(jié)點和文本節(jié)點的 nodeValue 的值:

// 獲取元素節(jié)點
var elemNode = document.getElementById("btn");
// 獲取屬性節(jié)點
var attrNode = elemNode.getAttributeNode("title");
// 獲取文本節(jié)點
var textNode = elemNode.firstChild;

console.log("元素節(jié)點的nodeValue: " + elemNode.nodeValue);
console.log("屬性節(jié)點的nodeValue: " + attrNode.nodeValue);
console.log("文本節(jié)點的nodeValue: " + textNode.nodeValue);

本教程免費開源，任何人都可以免費學(xué)習(xí)、分享，甚至可以進(jìn)行修改。但需要注明作者及來源，并且不能用于商業(yè)。

本教程采用知識共享署名-非商業(yè)性使用-禁止演繹 4.0 國際許可協(xié)議進(jìn)行許可。

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/84293.html

相關(guān)文章

  • 【EASYDOM系列教程】之遍歷節(jié)點

    摘要：對象提供了一系列的屬性和方法用來利用節(jié)點樹結(jié)構(gòu)中節(jié)點的關(guān)系實現(xiàn)遍歷其中的節(jié)點。在上述語法結(jié)構(gòu)中，屬性返回指定節(jié)點的父元素節(jié)點。該屬性獲取一個包含指定節(jié)點的所有子節(jié)點的集合。值得注意的是及之前版本的瀏覽器中不存在空白節(jié)點問題。 Node 對象提供了一系列的屬性和方法用來利用 DOM 節(jié)點樹結(jié)構(gòu)中節(jié)點的關(guān)系實現(xiàn)遍歷其中的節(jié)點。 關(guān)于節(jié)點之間的關(guān)系，可以參考《DOM樹結(jié)構(gòu)》一節(jié)有關(guān)節(jié)點之間關(guān)...

    BigNerdCoding 評論0 收藏0

  • 【EASYDOM系列教程】之屬性操作

    摘要：對象提供了一些方法實現(xiàn)元素的屬性操作，這種操作要比對象提供的方法操作屬性節(jié)點要更便捷。值得注意的是如果指定的屬性不存在，則返回或空字符串。如果刪除的屬性不存在的話，不會引發(fā)任何異常。 Element 對象提供了一些方法實現(xiàn) HTML 元素的屬性操作，這種操作要比 Node 對象提供的方法操作屬性節(jié)點要更便捷。 獲取指定元素的屬性 Element 對象提供了 getAttribute()...

    BigNerdCoding 評論0 收藏0

  • 【EASYDOM系列教程】之DOM 樹結(jié)構(gòu)

    摘要：簡單來說，節(jié)點作為樹結(jié)構(gòu)中的連接點，最終構(gòu)成了完整的樹結(jié)構(gòu)。節(jié)點樹結(jié)構(gòu)通過節(jié)點概念，我們可以將原本的樹結(jié)構(gòu)改成節(jié)點樹結(jié)構(gòu)進(jìn)行表示。節(jié)點之間的關(guān)系中的表示模型，也可以用來表示節(jié)點樹結(jié)構(gòu)中節(jié)點之間的關(guān)系。值得注意的是和元素并不是兄弟關(guān)系。 DOM 樹結(jié)構(gòu) DOM 之所以可以訪問和更新 HTML 頁面中的內(nèi)容、結(jié)構(gòu)和樣式，是因為 DOM 將 HTML 頁面解析為一個 樹結(jié)構(gòu)。 例如下面這段代...

    nemo 評論0 收藏0

  • 【EASYDOM系列教程】索引

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

    yanwei 評論0 收藏0

  • 【EASYDOM系列教程】之刪除節(jié)點

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

    zzbo 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<