<body>
<!--调整前-->
<!--
<div id="con">
<p>javascript</p>
<div>jQuery</div>
<h5>PHP</h5>
</div>
-->
<!--调整后-->
<div id="con"><p>javascript</p>
<div>jQuery</div>
<h5>PHP</h5></div> /
<script type="text/javascript">
var x=document.getElementById("con");
document.write("div的第一个子节点:"+x.firstChild.nodeName+"<br>");
document.write("div的最后一个子节点:"+x.lastChild.nodeName);
</script>
</body>
</html>
如上图
空白文本节点
调整前,第一个子节点和最后一个子节点都是空白文本节点。
调整后,第一个子节点:
节点名:P (元素节点的nodeName和标签名相同)
节点值:null(元素节点的nodeValue为null或者undefined)
节点类型:1 (nodeType为1代表元素节点)
调整后,最后一个子节点:
节点名:H5
节点值:null
节点类型:1