獲取子節點 · JavaScript

## childNodes(所有子節點) ## children(所有子元素) 使用這個屬性獲取子元素比較方便.IE6-8可能會獲取到注釋節點. ## hasChildNodes() 該方法返回布爾值,判斷是否有子節點.空白頁算是子節點. ## 節點操作,隔行變色 ``` <body> <ul id="mv"> <li>西施</li> <li>貂蟬</li> <li>王昭君</li> <li>楊玉環</li> </ul> <script> var mv = document.getElementById('mv'); if (mv.hasChildNodes()) { for (let i = 0; i < mv.children.length; i++) { var li = mv.children[i]; if (i % 2 == 0) { li.style.backgroundColor = 'red'; } else { li.style.backgroundColor = 'skyblue'; } } } </script> ``` ## 第一個子節點和最后一個子節點 ``` <div id="box"> <div>這是一個廣告圖片</div> <ul> <li>這是一個列表</li> </ul> <span>說明性文字</span> </div> <script> var box = document.getElementById('box'); console.log(box.firstChild);//第一個子節點 console.log(box.lastChild);//最后一個子節點 console.log(box.firstElementChild);//第一個子元素 console.log(box.lastElementChild); //最后一個子元素 </script> ```