节点类型

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title></title>

</head>

<body>

<div id="div1">

test

</div>

<input type="text" name="text1" id="text1" value="" />

<input type="button" name="btn1" id="btn1" value="click" />

<!--test-->

<script type="text/JavaScript">

// 标签是一种节点类型

// 节点是包含了标签、注释、文本、doctype等在内的多种组合

// 1.标签节点 返回值是1

// 2.文本节点 返回值是3

// 3.注释节点

// 通过nodeType()属性，能够知道节点类型是什么

var oDiv = document.getElementById("div1");

var oText = document.getElementById("text1");

var oBtn = document.getElementById("btn1");

if (oDiv.nodeType == 1) {

console.log("标签节点");

console.log(oDiv.nodeName); //nodeName 标签名

}

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

console.log("文本节点");

console.log(oDiv.firstChild.nodeName); //文本节点nodeName是#text

console.log(oDiv.firstChild.nodeValue);

}

// alert(oDiv.nodeType);

// alert(oDiv.firstChild.nodeType);

 

// nodeName,nodeValue

// nodeName 属性规定了节点的名称

// 元素节点的nodeName与标签名相同，并且是大写的

// 文本节点的nodeName是#text

 

// nodeValue属性规定了节点的值

// 元素节点的nodeValue是null或undefined

// 文本节点的nodeValue是文本本身

// 属性节点的nodeValue是属性值

 

// alert(oDiv.nodeName);

// alert(oDiv.firstChild.nodeName);

// alert(oBtn.nodeValue);

// alert(oText.nodeValue);

// alert(oDiv.nodeValue);

// alert(oDiv.firstChild.nodeValue);

</script>

</body>

</html>

posted @ 2017-01-11 15:02  天涯海角路  阅读(128)  评论(0)    收藏  举报