js获取html中type属性,JavaScript获取节点类型、节点名称和节点值

DOM节点信息包括节点类型(nodeType)、节点名称(nodeName)和节点值(nodeValue)。

节点类型

DOM节点中，每个节点都拥有不同的类型。

W3C规范中常用的 DOM节点类型有以下几种：

节点类型

说明

值

元素节点

每一个HTML标签都是一个元素节点，如

、

、

• 等

1

属性节点

元素节点(HTML标签)的属性，如 id 、class 、name 等。

2

文本节点

元素节点或属性节点中的文本内容。

3

注释节点

表示文档注释，形式为。

8

文档节点

表示整个文档(DOM 树的根节点，即 document )

9

获取节点类型的语法：

nodeObject.nodeType

其中，nodeObject 为DOM节点(节点对象)。该属性返回以数字表示的节点类型，例如，元素节点返回 1，属性节点返回 2 。

例如，获取id="demo"的

标签的节点类型：

document.getElementById("demo").nodeType;

该语句的返回值为 1 。

举例，获取元素节点和文本节点的类型值：

点击这里显示节点类型

document.getElementById("demo1").οnclick=function(){

var divType=this.nodeType;

var textType=this.firstChild.nodeType;  //  this 指当前发生事件的HTML元素，这里是

标签

alert(

"

标签的节点类型是："+divType+"\n"+

"

标签内部文本的节点类型是："+textType

);

}

请看演示：

点击这里显示节点类型

节点名称

节点名称就是DOM节点的名字，不同类型的节点对应不同的节点名称。

节点类型

节点名称

元素节点

HTML标签的名称(大写)

属性节点

属性的名称

文本节点

它的值永远是#text

文档节点

它的值永远是#document

获取节点名称的语法：

nodeObject.nodeName

其中，nodeObject 为DOM节点(节点对象)。

例如，获取id="demo"的

标签的节点名称：

document.getElementById("demo").nodeName;

该语句的返回值为 DIV 。

举例，获取元素节点名称、文本节点名称和文档节点名称：

点击这里显示节点名称

document.getElementById("demo2").οnclick=function(){

var divName=this.nodeName;

var textName=this.firstChild.nodeName;  //  this 指当前发生事件的HTML元素，这里是

标签

var documentName=document.nodeName

alert(

"

标签的节点名称是："+divName+"\n"+

"

标签内部文本的节点名称是："+textName+"\n"+

"文档节点的节点名称是："+documentName

);

}

请看下面的演示：

点击这里显示节点名称

节点值

对于文本节点，节点值为文本内容；对于属性节点，节点值为属性的值。

节点值对于文档节点和元素节点是不可用的。

获取节点值的语法：

nodeObject.nodeValue

其中，nodeObject 为DOM节点(节点对象)。

举例，获取文本节点的节点值：

点击这里显示文本节点的值

document.getElementById("demo3").οnclick=function(){

alert(this.firstChild.nodeValue);  //  this 指当前发生事件的HTML元素，这里是

标签

}

请看下面的演示：

点击这里显示文本节点的值