首先了解一下DOM中有三大节点,分别是 元素节点,文本节点,属性节点

元素节点:构成了DOM的基础。文档结构中,<html>是根元素,代表整个文档,其他的还有<head>,<body>,<p>,<span>等等。元素节点之间可以相互包含(当然遵循一定的规则)

文本节点:包含在元素节点中。

属性节点:元素都可以包含一些属性,属性的作用是对元素做出更具体的描述,比如id,name之类的。

以下面的demo为例:

<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 属性含有某个节点的名称。

元素节点的 nodeName 是标签名称(返回的名称是大写的)

属性节点的 nodeName 是属性名称(返回的名称是大写的)

文本节点的 nodeName 永远是 #text

文档节点的 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

nodeType、nodeName和nodeValue的更多相关文章

  1. childNodes、nodeName、nodeValue 以及 nodeType

    nodeName.nodeValue 以及 nodeType 包含有关于节点的信息. nodeName 属性含有某个节点的名称. 元素节点的 nodeName 是标签名称属性节点的 nodeName ...

  2. Dom中的nodeName、nodeValue 、nodeType

    nodeName.nodeValue 以及 nodeType 包含有关于节点的信息. nodeName 属性含有某个节点的名称. 元素节点的 nodeName 是标签名称 属性节点的 nodeName ...

  3. jquery冲突的关键字nodeName、nodeValue和nodeType!

    原文:http://blog.csdn.net/hdfyq/article/details/52805836 [缘由]在工作流数据库设计的时候,  都节点管理的功能.  结果有2个字段为  NODE_ ...

  4. hasChildNodes()方法,nodeName、nodeValue、nodeType介绍

    Document对象的使用:hasChildNodes()方法,nodeName.nodeValue.nodeType的简单介绍 一.hasChildNodes() 说明: (1)       该方法 ...

  5. 节点nodeName与nodeValue表

  6. DOM 小总结

    DOM 是什么 文档对象模型,是针对 HTML 和 XML 文档的一个 API (应用程序编程接口), 描绘了一个层次化的节点树. D: document 当 web 浏览器浏览一个页面的时候,DOM ...

  7. HTML DOM的nodeName,nodeValue,nodeType介绍

    将HTML DOM中几个常用的属性做下介绍,工作中作为参考. nodeName 属性可依据节点的类型返回其名称. 元素节点的 nodeName 是标签名称 属性节点的 nodeName 是属性名称 文 ...

  8. HTML DOM 节点介绍(nodeName,nodeValue,nodeType)

    对于初学者来说,HTML DOM 里面的 nodeName.nodeValue 以及 nodeType 三个属性的作用和取值不是很清楚.下面整理的信息包含有关于节点的详细信息,供参考. 节点信息 每个 ...

  9. DOM节点中属性nodeName、nodeType和nodeValue的区别 < Delphi >

    http://msdn.microsoft.com/zh-cn/library/vstudio/hf9hbf87.aspx <?xml version="1.0"?> ...

随机推荐

  1. Bootstrap <基础三十>Well

    Well 是一种会引起内容凹陷显示或插图效果的容器 <div>.为了创建 Well,只需要简单地把内容放在带有 class .well 的 <div> 中即可.下面的实例演示了 ...

  2. AAS代码运行-第4章

    [root@node1 aas]# ls ch02 ch03 spark--bin-hadoop2. spark--bin-hadoop2..tgz [root@node1 aas]# cd spar ...

  3. 针对不同浏览器,CSS如何写

    我们在开发DIV+CSS页面时候常常会遇到开发出的网页的一些地方在各大浏览器比如微软IE6.微软IE7.微软IE8.火狐浏览器.谷歌浏览器有一些不同,如宽度.高度等地方有相差误.IE6比较老的版本浏览 ...

  4. web前端基础篇⑨

    1.web端.app端 目前实现响应式布局,主要用以下两种方式.CSS原生代码响应式布局 @media screen.bootstrap移动设备优先.自带框架. 兼容性 用原生代码的话 根据不同的屏幕 ...

  5. oracle问题

    (1) 连通性: 注册中心负责服务地址的注册与查找,相当于目录服务,服务提供者和消费者只在启动时与注册中心交互,注册中心不转发请求,压力较小 监控中心负责统计各服务调用次数,调用时间等,统计先在内存汇 ...

  6. 第三篇——软件之殇,WE ARE THOUSANDS APART!

    软件工程是一门工程性的学科,其目标主要是成功地建造一个大型软件系统.这其中包括:付出较低的开发成本:达到要求的软件功能:取得较好的软件性能:开发的软件易于移植:需要较低的维护费用:能按时完成开发任务, ...

  7. Beta版

    Beta版使用说明 各文件介绍:本软件是基于visual studio 2010 平台,使用C#语言开发的windows窗体游戏.该游戏共有七个界面,分别是开始界面,游戏说明界面,模式选择界面,经典模 ...

  8. 安装生物信息学软件-HUMAnN2

    先挖坑 因为这个软件需要memory>16G,所以应该要安装在服务器上

  9. 随感一:android handler传值更改ui

    handler+looper传值更改activity的UI 博客开了一段时间,一直想写点自己的学习经验及体会,等着以后长时间不用再要用到的时候直接拿过来上手.想了想,之前用到handler, 看了几篇 ...

  10. 【转】Duff's Device

    在看strcpy.memcpy等的实现发现用了内存对齐,每一个word拷贝一次的办法大大提高了实现效率,参加该blog(http://totoxian.iteye.com/blog/1220273). ...