在學習Javascript的dom階段，為了加深對節點的理解，方便日后使用，封裝了一下獲得classname函數，具體如下：
1 <script> 2 function getByClass(Parent, sClass) { 3 var aEle = Parent.getElementsByTagName('*'); 4 var aReturn = []; 5 for (var i = 0; i < aEle.length; i++) { 6 if (aEle[i].className == sClass) { 7 aReturn.push(aEle[i]); 8 } 9 } 10 return aReturn; 11 }; 12 window.onload = function () { 13 var aUl = document.getElementsByTagName('ul'); 14 var aLi = getByClass(aUl, 'box'); 15 alert(aLi.length); 16 for (var i = 0; i < aLi.length; i++) { 17 aLi[i].style.background = 'red'; 18 } 19 }; 20 </script> 21 </head> 22 23 <body> 24 <ul> 25 <li class="box">1</li> 26 <li class="box">1</li> 27 <li></li> 28 <li></li> 29 <li class="box">1</li> 30 </ul> 31 </body>
發現第三行始終報錯：Uncaught TypeError: Parent.getElementsByTagName is not a function
多方測試，發現所有元素獲取都正常，形參Parent得到的也是aUl，在網上搜索解決辦法也遲遲未果，我便開始了如下嘗試：
首先我判斷應該是Parent處出現了問題，那么我在13行下加了一行：
var a = document.getElementsByTagName('ul').getElementsByTagName('*');
同樣顯示報錯，所以問題出在了這個getElementsByTagName上。
實際上document.getElementsByTagName（）雖然數量是1，但是同樣是個數組。
getElementsByTagName()方法的操作對象是一個確定唯一的元素，因此不滿足。
將3行改為 var aEle = Parent(0).getElementsByTagName('*'); 即可。
ps：
在獲得元素后，可用innerHtml獲取和修改元素。