第二十五节 JavaScript通过标签获取元素
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script type="text/javascript"> 7 window.onload = function(){ 8 9 // 通过标签名称获取li元素,生成一个选择集,不是数组,但是有一些数组的方法同样可以使用。 10 var aLi = document.getElementsByTagName('li'); 11 alert(aLi.length); 12 13 // aLi.style.backgroundColor = 'gold'; 14 // aLi是一个选择集,不能这样给属性。 15 16 aLi[0].style.backgroundColor = 'gold'; 17 // 可以通过下标具体给指定的li标签加背景色,如果全部li都要加,需要用for循环。 18 for(var i=0;i<aLi.length;i++){ 19 aLi[i].style.backgroundColor = 'gold'; 20 } 21 22 var oUl = document.getElementById('list1'); 23 var aLi2 = oUl.getElementsByTagName('li'); 24 for(var i=0;i<aLi2.length;i++){ 25 aLi2[i].style.backgroundColor = 'green'; 26 } 27 } 28 </script> 29 </head> 30 <body> 31 <ul id="list1"> 32 <li>1</li> 33 <li>2</li> 34 <li>3</li> 35 <li>4</li> 36 <li>5</li> 37 <li>6</li> 38 <li>7</li> 39 <li>8</li> 40 </ul> 41 42 <ul id="list2"> 43 <li>1</li> 44 <li>2</li> 45 <li>3</li> 46 <li>4</li> 47 <li>5</li> 48 </ul> 49 </body> 50 </html>