原生javascript實現獲取指定元素下所有後代元素程式碼例項

antzone發表於2017-03-29
JavaScript

在本版塊介紹過實現此功能的程式碼程式碼，但是在程式碼量上比較麻煩，採用的是迴圈遞迴的方式。

上面你所說的方式可以參閱原生的javascript獲取指定元素下所有的元素節點一章節，此文介紹的看起來非常的麻煩，那麼下面就分享一個比較簡單的方式，使用原生的javascript方法即可實現此功能。

程式碼例項如下:

[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 nodes=obox.getElementsByTagName("*");
  oshow.innerHTML=nodes.length;
}
</script>
</head>
<body>
<div id="show"></div>
<div id="box">
  <div>
    <ul>
      <li>螞蟻部落一</li>
      <li>螞蟻部落二</li>
      <li>螞蟻部落三</li>
    </ul>
  </div>
</div>
</body>
</html>

上面的程式碼實現了我們的要求，引數星號表示一個萬用字元，它可以匹配所有型別的標籤。

getElementsByTagName()方法的呼叫物件決定了它的查詢範圍。

相關文章