js封裝獲取元素類名(className)的方法
阿新 • • 發佈：2019-02-20
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <ul id="list"> <li class="on">1</li> <li class="select">2</li> <li class="on">3</li> <li>4</li> <li class="haha hehe papa">666</li> </ul> <p class="on">class為on的p標籤</p> <script type="text/javascript"> window.onload=function(){ var len1= getByClass("on",'list'); //console.log(document.getElementsByTagName("*")[10].className);//測試多個className返回值型別是什麼:--字串型別; //console.log(len1.length); // alert(len1.length); // 結果等於2為正確 var len2= getByClass('on'); //console.log(len2[1].innerHTML); //alert(len2.length); // 結果等於3為正確 } function getByClass(clsName, parent){ //定義函式getByClass()實現獲取document或指定父元素下所有class為on的元素 var oParent=parent?document.getElementById(parent):document, arr=new Array(), cls=oParent.getElementsByTagName("*"); for(var i=0;i<cls.length;i++){ if(cls[i].className===clsName){/*其實用這種寫法更優,應為一個元素可能有多個className,採用===判斷符號無法解決這種情況,採用indexOf()可以判斷出stringObject是否存在以及索引位置,如果是返回-1表示不存在.//cls[i].className.indexOf(clsName)!=-1*/ arr.push(cls[i]); } } return arr; } </script> </body> </html>