原生JS选择同胞节点

大 | 中 | 小
[不指定 2015/11/07 19:49 | by 刘新修 ]
XML/HTML代码
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4. <meta charset="utf-8">  
  5. <title>Document</title>  
  6. <script type="text/javascript">  
  7. window.onload=function(){  
  8.   var oli=document.getElementById("box1");  
  9.   var obox=oli.parentNode;  
  10.   var lis=obox.children;  
  11.   for(var i=0;i<lis.length;i++){  
  12.     if(lis[i]!=oli){  
  13.       lis[i].style.color="red";  
  14.     }  
  15.   }  
  16. }  
  17. </script>  
  18. </head>  
  19. <body>  
  20. <ul id="box1">  
  21.   <li>111</li>  
  22.   <li id="antzone">222</li>  
  23.   <li>333</li>  
  24.   <li>444</li>  
  25. </ul>  
  26. <ul id="box2">  
  27.   <li>111</li>  
  28.   <li id="antzone">222</li>  
  29.   <li>333</li>  
  30.   <li>444</li>  
  31. </ul>  
  32. <ul id="box3">  
  33.   <li>111</li>  
  34.   <li id="antzone">222</li>  
  35.   <li>333</li>  
  36.   <li>444</li>  
  37. </ul>  
  38. <ul id="box4">  
  39.   <li>111</li>  
  40.   <li id="antzone">222</li>  
  41.   <li>333</li>  
  42.   <li>444</li>  
  43. </ul>  
  44. </body>  
  45. </html>  
H5/JS/CSS | 评论(0) | 引用(0) | 阅读(4841)