nodeType、nodeName和nodeValue

時間 2019-12-14

標籤 nodetype nodename nodevalue 简体版

原文原文鏈接

首先了解一下DOM中有三大節點，分別是元素節點，文本節點，屬性節點html

元素節點：構成了DOM的基礎。文檔結構中，<html>是根元素，表明整個文檔，其餘的還有<head>,<body>,<p>,<span>等等。元素節點之間能夠相互包含(固然遵循必定的規則)node

文本節點：包含在元素節點中。ui

屬性節點：元素均可以包含一些屬性，屬性的做用是對元素作出更具體的描述，好比id,name之類的。spa

如下面的demo爲例：code

<script>
window.onload = function(){
  　　var element = document.getElementById("span");
  　　var text = element.firstChild;
  　　var property=document.getElementById("span").getAttributeNode("id");
}
</script>

<body>
　　<div>
　  　　<span id="span">文本節點</span>
　　</div>
</body>

(一)nodeName 屬性含有某個節點的名稱。htm

元素節點的 nodeName 是標籤名稱（返回的名稱是大寫的）blog

屬性節點的 nodeName 是屬性名稱（返回的名稱是大寫的）ip

文本節點的 nodeName 永遠是 #textelement

文檔節點的 nodeName 永遠是 #document文檔

註釋：nodeName 所包含的 XML 元素的標籤名稱永遠是大寫的

alert("這是元素節點的返回值："+ element.nodeName);//返回的標籤名SPAN,注意是大寫的
alert("這是文本節點的返回值："+ text.nodeName);//返回的#text
alert("這是屬性節點的返回值："+ property.nodeName);//返回的是屬性名，這裏是id

(二)nodeValue

對於文本節點，nodeValue 屬性包含文本。

對於屬性節點，nodeValue 屬性包含屬性值。

nodeValue 屬性對於文檔節點和元素節點是不可用的。

alert("這是元素節點的返回值："+ element.nodeValue);//自己就沒有意義，這裏是試驗下的，返回的是null
alert("這是文本節點的返回值："+ text.nodeValue);//返回的是文本值  文本節點
alert("這是屬性節點的返回值："+ property.nodeValue);//返回的是屬性值，這裏是id的屬性值span

(三)nodeType

nodeType 屬性可返回節點的類型。

咱們經常使用的3中類型：
nodeType == 1  ：元素節點
nodeType == 2  ：屬性節點
nodeType == 3  ：文本節點

註釋 comments 8

文檔 document 9

  alert("這是元素節點的返回值："+ element.nodeType);//元素節點返回1
  alert("這是文本節點的返回值："+ text.nodeType);//文本節點返回3
  alert("這是屬性節點的返回值："+ property.nodeType);//屬性節點返回2

___________________________

原文：http://www.tuicool.com/articles/zANnye

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。