DOMchildNOdes



<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>無標題文檔</title>
<script>
window.onload = function() {
 
 var oUl = document.getElementById('ul1');
 
 /*
  元素.childNodes : 只讀 屬性 子節點列表集合
   標準下:包含了文本和元素類型的節點,也會包含非法嵌套的子節點
   非標準下:只包含元素類型的節點,ie7以下不會包含非法嵌套子節點
   
   childNodes只包含一級子節點,不包含後輩孫級以下的節點
  
  DOM節點的類型有很多種 12種
  
  元素.nodeType : 只讀 屬性 當前元素的節點類型
  
  元素節點 : 1
  屬性節點 : 2
  文本節點 : 3
 */
 
 alert( oUl.childNodes.length );
 
 //alert( oUl.nodeType );
 
 //alert(oUl.childNodes[0].nodeType);
 
 //屬性
 // 元素.attributes : 只讀 屬性 屬性列表集合
 
 //alert( oUl.attributes.length );
 
 //alert( oUl.attributes[0].nodeType );
 
 /*for (var i=0; i<oUl.childNodes.length; i++) {
  
  if ( oUl.childNodes[i].nodeType == 1 ) {
   oUl.childNodes[i].style.background = 'red';
  }
  
 }*/
 
}
</script>
</head>

<body>
 <ul id="ul1" style="border: 1px solid red;">
        <li>11111 <span>span</span></li>
        <li>22222</li>
        <li>33333</li>
        <li>44444</li>
        <p>pppppppp</p>
    </ul>
</body>
</html>

發佈了52 篇原創文章 · 獲贊 9 · 訪問量 3萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章