為什么第一個節點的nodeValue值JavaScript輸出來了,后面第三個卻是空格呢
源碼如下
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>無標題文檔</title>
</head>
<body>
<div>
? javascript2 ?
? <p>javascript</p>
? <div>jQuery</div>
? <h5>PHP</h5>
</div>
<script type="text/javascript">
??? var nodeDIV = document.getElementsByTagName("DIV");
? ?
????? var x = nodeDIV[0].childNodes;
???? for(var i=0;i<nodeDIV[0].childNodes.length;i++)
?{
??? document.write("第"+(i+1)+"個節點的值是:"+x[i].nodeValue+"<br? />");
??? document.write("第"+(i+1)+"個節點的名稱是:"+x[i].nodeName+"<br? />");
??? document.write("第"+(i+1)+"個節點的屬性是:"+x[i].nodeType+"<br? />");
??? document.write("<br? />");
?}
</script>
</body>
</html>
2016-04-08
不同瀏覽器(IE,Firefox,chrome等)得出的節點數不一樣,以上代碼IE會輸出3個節點(p,div,h5),其他瀏覽器有七個(將兩個標簽間的空白文檔算作子節點共四個)。1輸出的是第一行的文本文檔值Javascript。所以3、5的value沒有值是因為她們是空白文檔。
2016-04-08
改成下面的樣子就好了
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>無標題文檔</title>
</head>
<body>
<div>javascript2<p>javascript</p><div>jQuery</div><h5>PHP</h5></div>
<script type="text/javascript">
? ? var nodeDIV = document.getElementsByTagName("DIV");
? ?
? ? ? var x = nodeDIV[0].childNodes;
? ? ?for(var i=0;i<nodeDIV[0].childNodes.length;i++)
?{
? ? document.write("第"+(i+1)+"個節點的值是:"+x[i].nodeValue+"<br ?/>");?
? ? document.write("第"+(i+1)+"個節點的名稱是:"+x[i].nodeName+"<br ?/>");?
? ? document.write("第"+(i+1)+"個節點的屬性是:"+x[i].nodeType+"<br ?/>");
? ? document.write("<br ?/>");
?}
</script>
</body>
</html>