`

谈谈元素节点类型的值

阅读更多
名词“节点”其实就是关联文档内部所有元素的一个东东,不管它是特定的DIV标记,还是包含的文本,我们都叫这个东东为节点;而它的“节点类型”属性能帮助你准确地判断当前正在访问的节点是什么类型。(这不废话么,En国人也真是的)。下面是“节点类型”可能的值:

The term "nodes" is just a fancy way of referring to all the elements in a document, whether it's a particular DIV, or the text contained inside it. The "nodeType" property of the DOM is very helpful in determining exactly the type of the node you're currently accessing, which isn't always so apparent. Here are the possible values returned by "nodeType":


看看下面的代码:

Consider the following HTML code:

<div id="adiv"><b>Some text</b></div>

<script type="text/javascript">
alert(document.getElementById("adiv").nodeType) //DIV element. Alerts 1
alert(document.getElementById("adiv").firstChild.nodeType) //B element. Alerts 1
</script>


看起来哈,如果使用HTML的语句块的话,或许并不真的需要使用“节点类型”这个属性来告诉自己节点的类型。(自己使用什么标记,自己当然晓得了)。那再看看下面稍稍修改的代码:

With the above HTML block, you don't really need the "nodeType" property  to tell you the types of the three nodes you're accessing. But consider this slightly modified example:

<div id="adiv"> <b>Some text</b></div>

<script type="text/javascript">
alert(document.getElementById("adiv").nodeType) //DIV element. Alerts 1
alert(document.getElementById("adiv").firstChild.nodeType) //Alerts 1 or 3, depending on browser.
</script>


(你发现差别了么,我开始时就没注意!)

在上面的代码中,我放了个空格在<B>元素前面。对一些浏览器来说(比如FF), 一个空格会被认为是文本节点(nodeType=3), 但是IE就不这样认为,所以究竟结果如何是与你的浏览器有关的。(所以有时使用“节点类型”这个属性判断一下还是有用的。)

Here I've added a blank space in front of the B element. To some browsers such as Firefox, a blank space is considered a text node (nodeType=3) just like regular text, while in others such as IE, they are not. Due to this, "the next node" after the DIV element varies depending on which browser you ask, with Firefox saying it's a text node, while IE says it's an element node (B element). Without the help of the nodeType property when traversing the document, your script may very well lose its place.

节点名称 nodeName property

“节点类型”返回的是一个数字,对大家来说或许太抽象了,所以可以使用“节点名称”这个属性,尽管它不够强壮,但它更人性化,更直观。 “节点名称”属性返回的是一个标识节点的字符串。下面是一些常见的返回的“节点名称”:
If the integer value returned by the "nodeType" property is too abstract for you, a more human, albeit less robust way, of returning the type of a node is using the "nodeName" property. It returns a string indicating the name of the node. Returned value is in uppercase. Here are some common "nodeName" property values returned:

For example:
if (document.getElementById("test").firstChild.nodeName=="DIV")
alert("This is a DIV")


nodeValue property

The "nodeValue" property is a read/write property that reflects the current value of a node. For text nodes, the content of the node is returned, while for attribute nodes, the attribute value. Null is returned for Document and element nodes. Use this property to alter the contents of a text or attribute node.
<div id="test">Old text</div>

<script type="text/javascript">
if (document.getElementById("test").firstChild.nodeName=="#text")
document.getElementById("test").firstChild.nodeValue="New text"

</script>


原文:http://www.javascriptkit.com/domref/nodetype.shtml
  • 大小: 7.3 KB
  • 大小: 13.9 KB
2
0
分享到:
评论

相关推荐

    春节7天练丨Day5:二叉树和堆1

    二叉查找树的特点是,对于任意节点,其左子树中的所有节点的值都小于该节点的值,而右子树中的所有节点的值都大于该节点的值。这使得二叉查找树具有快速查找、插入和删除的能力。以下是二叉查找树的基本操作: 1. ...

    C语言经典数据结构算法

    二叉树常用于实现搜索、排序等操作,例如二叉搜索树,其中每个节点的值都大于其左子树中的所有节点值且小于其右子树中的所有节点值。二叉树还有其他变种,如完全二叉树和满二叉树。二叉树的操作包括插入、删除、查找...

    谈谈C语言中“指针”的应用.pdf

    指针变量可以被声明为指向任何数据类型。 二、指针的声明、初始化和运算符 指针变量的声明语句中使用指针运算符“*”表示声明的变量是一个指针。需要强调的是,在声明语句中变量i只被声明为一个整型变量,因为指针...

    数据结构入门

    每个元素(称为节点)可以有零个或多个子节点,而只有一个父节点(除了根节点)。树常用于文件系统、数据库索引和编译器设计等领域。二叉树是最简单的树形式,每个节点最多只有两个子节点。二叉搜索树是一种特殊的...

    01-文本小节-高质量代码的特点.md

    例如,在操作DOM节点时,不仅要考虑元素节点,还要考虑文本节点和注释节点。此外,完整性要求开发者有意识地学习和练习,以便全面掌握某个功能或API,从而在项目中使用它们时可以做到游刃有余。 再来谈谈鲁棒性。...

    java数据结构算法

    1. 数组:是最基本的数据结构,用于存储固定数量的相同类型元素。数组提供了直接访问元素的能力,但插入和删除元素的操作相对较慢。 2. 链表:链表中的元素不是连续存储的,每个元素(节点)包含数据和指向下一个...

    Tree_树形结构_

    树形结构模拟了自然界中的树状关系,每个节点代表一个元素,节点间通过边相连,形成层次分明的结构。本篇文章将深入探讨“树形结构”的概念、特点以及其在实际应用中的优势。 首先,我们来看“树形结构”的基本概念...

    《数据结构(C语言版)》配书光盘.DSDemo.rar

    2. **链表**:不同于数组,链表中的元素在内存中不是连续存储的,每个元素(节点)包含数据和指向下一个节点的指针。链表分为单链表、双链表和循环链表等类型,灵活的插入和删除操作是其主要优点。 3. **栈**:是一...

    一些常用的数据结构与算法实现代码

    2. 链表:与数组不同,链表中的元素在内存中不一定是连续的,每个元素(节点)包含数据和指向下一个元素的引用。链表支持高效的插入和删除,但访问速度慢于数组。 3. 栈:栈是一种后进先出(LIFO)的数据结构,常...

    javascript的经典面试题汇总

    - **解析**:`===`是比较两个值是否完全相等,包括它们的数据类型。`null`和`undefined`的数据类型不同,所以这个表达式的结果是`false`。 - **选项C**: `null == undefined` - **解析**:`==`是比较两个值是否...

    java数据结构上机实践指导教程

    首先,我们来谈谈数据结构的基本类型。在Java中,常见的数据结构有数组、链表、栈、队列、集合、映射(哈希表)等。数组是最基本的数据结构,它是一组相同类型的元素的有序序列,可以通过索引来访问元素。链表则由一...

    数据结构和算法Flash动画演示

    1. **数组**:是最基本的数据结构,它是一系列相同类型元素的集合,通过索引进行访问。 2. **链表**:与数组不同,链表的元素在内存中不是连续的,每个元素(节点)包含数据和指向下一个节点的指针。 3. **栈**:...

    matlab开发-xml2结构错误修复和添加功能

    每个XML元素映射为一个结构体,元素的属性成为该结构体的字段,而元素的内容则作为字段值。子元素会成为嵌套的结构体。这种转换使得在MATLAB中处理XML数据变得直观且高效。 然而,当遇到错误时,可能的原因有多种。...

    数据结构及各种算法经典

    1. **数组**:基础的数据结构,用于存储相同类型的数据元素集合。数组提供随机访问,但插入和删除操作相对昂贵。 2. **链表**:链表中的元素在内存中并非连续存放,每个元素(节点)包含数据和指向下一个节点的引用...

    Algorithm:算法研究和编码测试准备

    优先队列是一种特殊类型的队列,其中元素按照优先级进行排列。当从队列中删除元素时,优先级最高的元素(通常是最早添加的或具有最高值的)将首先被处理。在Python中,可以借助堆数据结构实现优先队列。优先队列常...

    algorithme_algorithme_algorithm_

    快速排序则采用分治策略,选取一个基准值,将数组分为两部分,一部分所有元素小于基准,另一部分所有元素大于基准,然后对这两部分再进行快速排序。 搜索算法则用于在数据结构(如数组、链表或树)中查找特定元素。...

    C++ hash.zip

    4. **冲突处理**:在插入元素时,检查其散列值对应的链表是否为空,若非空则将新元素添加到链表尾部。 5. **内存管理**:考虑到C++的特点,类可能需要在构造和析构函数中负责动态内存的分配和释放。 `hash.o`是一个...

    javascript试题及答案推荐文档.doc

    - 获取或设置指定元素内部的所有 HTML 内容,包括子节点和它们的 HTML 标签。 - 在示例中,`document.getElementById("outer").innerHTML` 将返回 `&lt;span id="inner"&gt;text&lt;/span&gt;`。 - **`outerHTML`:** - 获取...

    数据结构相关的算法FLASH演示

    首先,我们来谈谈数据结构的基本类型。常见的有数组、链表、栈、队列、树、图等。数组是最基础的数据结构,它提供了一种直接访问任意元素的方式,但插入和删除操作可能比较慢。链表则允许快速插入和删除,但访问元素...

    Changqilong94-DataStruceture-master_java聊天_

    链表则不同,它的元素在内存中不是连续存放的,每个元素(节点)包含数据和指向下一个元素的引用。栈是一种后进先出(LIFO)的数据结构,常用于函数调用和表达式求值;队列则是先进先出(FIFO)的数据结构,适用于...

Global site tag (gtag.js) - Google Analytics