JavaScript hasChildNodes()

admin發表於2017-03-26
JavaScript

本章節通過程式碼例項介紹一下hasChildNodes()函式的作用，可能此函式在實際應用中的出現頻率不高，但是並非沒有用武之地，總之會總比不會要好的多，下面進入正題。此函式可以判斷指定元素是否具有子節點。

如果有則返回true，否則返回false。

語法結構:

[JavaScript] 純文字檢視 複製程式碼
elementNode.hasChildNodes()

程式碼例項:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>  
<html>  
<head>  
<meta charset=" utf-8">  
<meta name="author" content="http://www.softwhy.com/" />  
<title>螞蟻部落</title>  
<script type="text/javascript">
window.onload=function(){
  var obox=document.getElementById("box");
  var oshow=document.getElementById("show");
  var lis=obox.getElementsByTagName("li");
  oshow.innerHTML="第四個li:"+lis[3].hasChildNodes()+"<br/>"
  +"第五個li:"+lis[4].hasChildNodes()+"<br/>"
  +"第六個li:"+lis[5].hasChildNodes()
}
</script>
</head> 
<body> 
<div id="show"></div>
<ul id="box">
  <li>只有努力奮鬥才會有美好的未來。</li>
  <li>沒有人一開始就是高手，必須要好好學習。</li>
  <li>分享互助是進步的最大源動力。</li>
  <li>每一天都是新的要好好真心</li>
  <li> </li>
  <li></li>
</ul>
</body> 
</html>

上面你的程式碼對不同的li元素是否具有子節點進行了判斷。

特別說明:

在IE8和IE8以下的瀏覽器中，空格換行會被忽略，但是在IE8以上瀏覽器還有谷歌、火狐等標準瀏覽器中，會將空格和換行看做是文字節點，所以上面的程式碼的輸出結果在不同的瀏覽器中會有所不同。

相關文章