getbyclass

其实以前我偷偷学习正则表达式的时候,写过一个getbyclass的方法,最近翻了翻到处都是错,或者好多重复的,没有用的 代码,于是显得没事我就把这个精简了一下,其实这个方法现在我觉得也是有问题的,问题在于我不知道原生的getElementsByClassName获取元素后生产的是不是数组,不管这个到不是重点,以后有时间了我在验证一下就可以了,另外我发现css是区分大小写的,看来没事看看正则还是能涨很多知识的,因为我感觉这次简化的时候收获比较大,于是我决定把这次也简化记录下来,反正记录不花钱。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>getbyclass</title>
<style>
.a{ color:green!important;}
</style>
</head>
<body>
<ul id="oUl">
    <li class="A">111111111111111111111</li>
    <li class="as dfd">222222222222222222222</li>
    <li class="asd ad">333333333333333333333</li>
    <li class="sdfsd dfd 22df">444444444444444444444</li>
    <li class="jhasd gksdj">555555555555555555555</li>
    <li class="asd dfgf b as era">666666666666666666666</li>
    <li class="fgfa as efgf5 fghf2asdf">777777777777777777777</li>
</ul>
</body>
</html>
<script type="text/javascript">
var oUl=document.getElementById("oUl");
var aLi=document.getElementsByTagName("li");
var as=getbyclass("as",oUl);
for(var i=0;i<as.length;i++){
    as[i].style.color="red";
}


function getbyclass(oClass,Oparent){
    var oParent=oParent||document;
    if(Oparent.getElementsByClassName){
        return Oparent.getElementsByClassName(oClass)
    }else{
        var re=[];
        var reg=new RegExp("\b"+oClass+"\b")
        var ch=oParent.getElementsByTagName("*");
        for(var i=0;i<ch.length;i++){
            var str=ch[i].className;
            if(reg.test(str)){
                re.push(ch[i]);
            }    
        }
        return re;
    }
}
</script>
原文地址:https://www.cnblogs.com/busicu/p/3808459.html