JavaScript DOM 属性

来源:互联网 发布:js array splice 添加 编辑:程序博客网 时间:2024/06/16 00:07

下面是DOM 树里的各种节点的一些属性。

JavaScript DOM 属性

节点的属性

文档里的每个节点都有以下属性。

. nodeName

nodeName 属性将返回一个字符串,其内容是给定节点的名字:

name = node.nodeName

如果给定节点是一个元素节点,nodeName 属性将返回这个元素的名字;这在效果上相当于tagName 属性。

如果给定节点是一个属性节点,nodeName 属性将返回这个属性的名字。

如果给定节点是一个文本节点,nodeName 属性将返回一个内容为#text 的字符串。

nodeName 属性是一个只读属性——只能对它进行查询(读),不能直接对它进行设置(写)。

. nodeType

nodeType 属性将返回一个整数,这个数值代表着给定节点的类型:

integer = node.nodeType

nodeType 属性有2 种可取值。nodeType 属性所返回的整数值对应着以下12 种节点类型之一:

(1) ELEMENT_NODE

(2) ATTRIBUTE_NODE

(3) TEXT_NODE

(4) CDATA_SECTION_NODE

(5) ENTITY_REFERENCE_NODE

(6) ENTITY_NODE

(7) PROCESSING_INSTRUCTION_NODE

(8) COMMENT_NODE

(9) DOCUMENT_NODE

(10) DOCUMENT_TYPE_NODE

(11) DOCUMENT_FRAGMENT_NODE

(12) NOTATION_NODE

在这12 种节点类型当中,前3 种是最重要的。Web 上的绝大多数DOM 脚本都需要与元素节点、属性节点和文本节点打交道。

nodeType 属性通常与if 语句配合使用,以确保不会在错误的节点类型上执行无效或非法的操作。在下例中,某个函数只有一个名为mynode 的参数,这个参数可以是文档中的任何一个元素。这个函数将为该元素添加一个取值为this is important 的title 属性。在此之前,它先检查mynode 参数的nodeType 属性,以确保这个参数所代表的节点确实是一个元素节点:

function addTitle(mynode) {

if(mynode.nodeType == 1){

mynode.setAttribute(“title”, “this is imporant”);

}

}

nodeType 属性是一个只读属性。

. nodeValue

nodeValue 属性将返回给定节点的当前值:

value = node.nodeValue

这个属性将返回一个字符串。

如果给定节点是一个属性节点,nodeValue 属性将返回这个属性的值。

如果给定节点是一个文本节点,nodeValue 属性将返回这个文本节点的内容。

如果给定节点是一个元素节点,nodeValue 属性将返回null。

nodeValue 属性是一个读/写属性。不过,你不能对一个已经被定义为null 的值进行设置。换句话说,你不能为元素节点的nodeValue 属性设置一个值。你可以为文本节点的nodeValue 属性设置一个值。

下面这个例子将不能工作,因为它试图为一个元素节点设置一个值:

var message = document.getElementById(“fineprint”);

message.nodeValue = “this won’t work”;

下面这个例子有可能可以工作。它试图为一个元素节点的第一个子节点设置一个值。只要这

个第一个子节点是一个文本节点,新值就可以设置成功:

var message = document.getElementById(“fineprint”);

message.firstChild.nodeValue = “this might work”;

下面这个例子肯定可以工作。这里增加了一项测试以检查fineprint 元素节点的第一个子节点是否为文本节点:

var message = document.getElementById(“fineprint”);

if(message.firstChild.nodeType == 3){

message.firstChild.nodeValue = “this will work”;

}

如果需要刷新某个文本节点的值,nodeValue 属性提供了最简单的机制。如果需要刷新某个属性节点的值,通过这个属性节点的父节点和setAttribute()方法设置往往更简明易行。

遍历节点树

从以下属性读取出来的信息可以让我们了解相邻节点之间的关系。

. childNodes

childNodes 属性将返回一个数组,这个数组由给定元素节点的子节点构成:

nodelist = node.childNodes

这个属性所返回的数组是一个nodeList 集合。这个nodeList 集合里的每个节点都是一个节点对象。这些节点对象都有着nodeType、nodeName、nodeValue 等常见的节点属性。

文本节点和属性节点都不可能再包含任何子节点,所以它们的childNodes 属性永远会返回一个空数组。

如果只是想知道某个元素有没有子节点,可以使用hasChildNodes 方法。

如果想知道某个元素有多少个子节点,请使用childNodes 数组的length 属性:

node.childNodes.length

即使某个元素只有一个子节点,childNodes 属性也将返回一个节点数组而不是返回一个单个的节点。此时,childNodes 数组的length 属性值将是1。比如说,如果某个网页上的document 元素只有html 元素这一个子节点,那么document.childNodes[0].nodeName 的值将是HTML。

childNodes 属性是一个只读属性。如果需要给某个元素增加子节点,可以使用appendChild()或insertBefore()方法;如果需要删除某个元素的子节点,可以使用removeChild()方法;在使用这几种方法增、减某个元素的子节点时,这个元素的childNodes 属性将自动刷新。

. firstChild

firstChild 属性将返回一个给定元素节点的第一个子节点:

reference = node.firstChild

这个属性返回一个节点对象的引用指针。这个节点对象都有着nodeType、nodeName、nodeValue等常见的节点属性。

文本节点和属性节点都不可能再包含任何子节点,所以它们的firstChild 属性永远会返回null。

某个元素的firstChild 属性等价于这个元素的childNodes 节点集合中的第一个节点:

reference = node.childNodes[0]

如果只是想知道某个元素有没有子节点,可以使用hasChildNodes 方法。如果某个节点没有任何子节点,它的firstChild 属性将返回null。

firstChild 属性是一个只读属性。

. lastChild

lastChild 属性将返回一个给定元素节点的最后一个子节点:

reference = node.lastChild

这个属性返回一个节点对象的引用指针。这个节点对象都有着nodeType、nodeName、nodeValue等常见的节点属性。

文本节点和属性节点都不可能再包含任何子节点,所以它们的lastChild 属性永远会返回null。

某个元素的lastChild 属性等价于这个元素的childNodes 节点集合中的最后一个节点:

reference = node.childNodes[elementNode.childNodes.length-1]

如果只是想知道某个元素有没有子节点,可以使用hasChildNodes 方法。如果某个节点没有任何子节点,它的lastChild 属性将返回null。

lastChild 属性是一个只读属性。

. nextSibling

nextSibling 属性将返回一个给定节点的下一个子节点:

reference = node.nexSibling

这个属性返回一个节点对象的引用指针。这个节点对象都有着nodeType、nodeName、nodeValue等常见的节点属性。

如果给定节点的后面没有同属一个父节点的节点,它的nextSibling 属性将返回null。

nextSibling 属性是一个只读属性。

. parentNode

parentNode 属性将返回一个给定节点的父节点:

reference = node.parentNode

这个属性返回一个节点对象的引用指针。这个节点对象都有着nodeType、nodeName、nodeValue等常见的节点属性。

parentNode 属性返回的节点永远是一个元素节点,因为只有元素节点才有可能包含子节点。唯一的例外是document 节点,它没有父节点。换句话说,document 节点的parentNode 属性将返回null。

parentNode 属性是一个只读属性。

. previousSibling

previousSibling 属性将返回一个给定节点的前一个子节点:

reference = node.previousSibling

这个属性返回一个节点对象的引用指针。这个节点对象都有着nodeType、nodeName、nodeValue等常见的节点属性。

如果给定节点的前面没有同属一个父节点的节点,它的previousSibling 属性将返回null。

previousSibling 属性是一个只读属性。

---更多Java学习资料可关注微信公众号:kaigexuetang_com

0 0
原创粉丝点击