封装getByClass(JS获取class的方法封装为一个函数)
JS获取class的方法一:
普通版:
<script type="text/javascript"> function getByClass(oParent, sClass) { var aEle=oParent.getElementsByTagName('*'); var aResult=[]; var i=0; for(i=0;i<aEle.length;i++) { if(aEle[i].className==sClass) { aResult.push(aEle[i]); } } return aResult; } </script>
JS获取class的方法二:
完美版:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <script> function getByClass(oParent, sClass) { var aEle=oParent.getElementsByTagName('*'); var aResult=[]; var re=new RegExp('\\b'+sClass+'\\b', 'i'); var i=0; for(i=0;i<aEle.length;i++) { //if(aEle[i].className==sClass) //if(aEle[i].className.search(sClass)!=-1) if(re.test(aEle[i].className)) { aResult.push(aEle[i]); } } return aResult; } window.onload=function () { var oUl=document.getElementById('ul1'); var aBox=getByClass(oUl, 'box'); var i=0; for(i=0;i<aBox.length;i++) { aBox[i].style.background='red'; } }; </script> </head> <body> <ul id="ul1"> <li></li> <li class="box active"></li> <li class="box"></li> <li></li> <li></li> <li class="box"></li> </ul> </body> </html>
本文作者: Jasmine
本文链接: https://www.jianbaizhan.com/article/520.html
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 3.0 许可协议。转载请注明出处!