节点信息

每个节点都拥有包含着关于节点某些信息的属性。这些属性是:
nodeName(节点名称) 
nodeValue(节点值) 
nodeType(节点类型) 
nodeType

nodeType 属性可返回节点的类型。

最重要的节点类型是:

元素类型

节点类型

元素(ELEMENT_NODE)

1

属性(ATTRIBUTE_NODE)

2

文本(TEXT_NODE)

3

注释(COMMENT_NODE)

8

文档(DOCUMENT_NODE)

9

在实际应用中,经常用到的就是元素节点、属性节点和文本节点了,下面我们通过小段代码进行讲解

1:元素节点
元素节点代码

  1. <HTML>
  2. <HEAD>
  3. <TITLE>空谷悠悠</TITLE>
  4. </HEAD>
  5. <BODY>
  6. <table>
  7. <tr>
  8. <td id="john" name="myname">John</td>
  9. <td>Doe</td>
  10. <td id="jack">Jack</td>
  11. </tr>
  12. </table>
  13. <script>
  14. var d = document.getElementById("john");
  15. alert(d.nodeType)
  16. alert(d.nodeName)
  17. alert(d.nodeValue)
  18. </script>
  19. </BODY>
  20. </HTML>

分析运行结果,其三个属性的值分别为:

nodeType:ELEMENT_NODE

nodeType值:1

nodeName:元素标记名    //此处为TD

nodeValue:null

2:属性节点

属性节点代码

  1. <HTML>
  2. <HEAD>
  3. <TITLE>空谷悠悠</TITLE>
  4. </HEAD>
  5. <BODY>
  6. <table>
  7. <tr>
  8. <td id="john" name="myname">John</td>
  9. <td>Doe</td>
  10. <td id="jack">Jack</td>
  11. </tr>
  12. </table>
  13. <script>
  14. var d = document.getElementById("john").getAttributeNode("name");
  15. alert(d.nodeType)
  16. alert(d.nodeName)
  17. alert(d.nodeValue)
  18. </script>
  19. </BODY>
  20. </HTML>

分析运行结果,其三个属性的值分别为:

nodeType:ATTRIBUTE_NODE

nodeType值:2

nodeName:属性名  // name

nodeValue:属性值  //myname

3:文本节点

文本节点代码

  1. <HTML>
  2. <HEAD>
  3. <TITLE>New Document</TITLE>
  4. </HEAD>
  5. <BODY>
  6. <table>
  7. <tr>
  8.    <td id="john" name="myname">John</td>
  9.    <td>Doe</td>
  10.   <td id="jack">Jack</td>
  11. </tr>
  12. </table>
  13. <script>
  14. var d = document.getElementsByTagName("td")[0].firstChild
  15. alert(d.nodeType)
  16. alert(d.nodeName)
  17. alert(d.nodeValue)
  18. </script>
  19. </BODY>
  20. </HTML>

分析运行结果,其三个属性的值分别为:

nodeType:TEXT_NODE

nodeType值:3

nodeName:#text

nodeValue:文本内容   // John

DOM中元素节点、属性节点、文本节点的理解13.3的更多相关文章

  1. DOM中元素节点、属性节点、文本节点

    DOM中有12中节点,但最常用到的是元素节点,属性节点,文本节点. 元素节点的节点类型(nodeType)是1: 属性节点的节点类型(nodeType)是2: 文本节点的节点类型(nodeType)是 ...

  2. DOM中元素节点、属性节点、文本节点的理解

    DOM中元素节点.属性节点.文本节点的理解 节点信息 每个节点都拥有包含着关于节点某些信息的属性.这些属性是:nodeName(节点名称) nodeValue(节点值) nodeType(节点类型)  ...

  3. DOM中元素节点,属性节点,文本节点的理解

    节点信息 每个节点都拥有包含着关于节点某些信息的属性.这些属性是: nodeName(节点名称) nodeValue(节点值) nodeType(节点类型) nodeType nodeType 属性可 ...

  4. 认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法。元素、属性和文本的树结构(节点树)。

    认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 先来看看下面代码 ...

  5. [转]XML中元素(Element)与节点(Node)的区别

    前言: element是特殊的node 一段纯文本即text-node也是node 但不是element w3c的原话是 A node can be an element node, an attri ...

  6. contents() 查找匹配元素内部所有的子节点(包括文本节点)。如果元素是一个iframe,则查找文档内容

    contents() V1.2概述 查找匹配元素内部所有的子节点(包括文本节点).如果元素是一个iframe,则查找文档内容   示例 描述:大理石平台检定规程 查找所有文本节点并加粗 HTML 代码 ...

  7. windows phone xaml文件中元素及属性(10)

    原文:windows phone xaml文件中元素及属性(10) Textblock xaml文件和隐藏文件 在设计界面的时候我们可以通过xaml中进行设计,这种设计是所见即所得的,很是方便,由于x ...

  8. php的form中元素name属性相同时的取值问题

    php的form中元素name属性相同时的取值问题:修改元素的名称,在名称后面加上 '[]',然后取值时即可得array()数组. 一.以复选框为例: <html> <head> ...

  9. Javascript进阶篇——(DOM—节点---属性、访问节点)—笔记整理

    节点属性在文档对象模型 (DOM) 中,每个节点都是一个对象.DOM 节点有三个重要的属性 : 1. nodeName : 节点的名称 2. nodeValue :节点的值 3. nodeType : ...

随机推荐

  1. js json按key值排序

    最近有个需求需要把json按key值进行排序,可是js并没有直接的函数可以对json进行排序的这么办呢? 然后想到了一个间接的方法来实现: 1.将json中的key值取出,存在一个数组中,然后对这个数 ...

  2. xcode升级到6.0以后遇到的警告错误 原帖链接http://www.cocoachina.com/bbs/simple/?t112432.html

    Xcode 升级后,常常遇到的遇到的警告.错误,解决方法 从sdk3.2.5升级到sdk 7.1中间废弃了很多的方法,还有一些逻辑关系更加严谨了.1,警告:“xoxoxoxo”  is depreca ...

  3. redis的主从复制和哨兵支持的主从切换

    1 主从复制的目的是为了读写分离 master写,然后同步到slave,slave只管读. 2 哨兵存在的目的 是为了主从切换,如果master挂了,那么一个slave成为master,重启之后的ma ...

  4. jQuery——能够编辑的表格

    版权声明:欢迎转载,请注明出处 https://blog.csdn.net/suneqing/article/details/26856635     今天学习了利用jQuery实现能够编辑的表格这个 ...

  5. 【C++基础学习】数据封装、构造函数

    第一部分 类和对象 内存中按照用途被划分的五个区:栈区.堆区.全局区.常量区.代码区栈区由系统来进行控制,无论是内存的分配还是回收都不需要程序员关心堆区由new分配内存,使用完成之后必须使用delet ...

  6. STM32 ~ 如何从ST网站找到对应的固件库

    ST官方网站改版后,基本上很难搜索到固件库的地址,找了半天才找到固件库的下载地址,通过此方法可以找到其他需要的资源,故记下来方便大家. 下载的网站地址为: Home>Tools and Soft ...

  7. hdu1078 FatMouse and Cheese —— 记忆化搜索

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1078 代码1: #include<stdio.h>//hdu 1078 记忆化搜索 #in ...

  8. 分布式锁(Redis实现)

    1.分布式锁解决方案  1.采用数据库 不建议 性能不好 jdbc  2.基于Redis实现分布式锁(setnx)setnx也可以存入key,如果存入key成功返回1,如果存入的key已经存在了,返回 ...

  9. SpringMVC与Struts2区别与比较

    1.Struts2是类级别的拦截, 一个类对应一个request上下文,SpringMVC是方法级别的拦截,一个方法对应一个request上下文,而方法同时又跟一个url对应,所以说从架构本身上Spr ...

  10. 盈创动力之 JS校验方法

    var IS_NULL = 128; // 10000000var IS_FULL = 64; // 01000000var IS_HALF = 32; // 00100000var IS_ASCII ...