getElementsByClassName compliant packages

As we all know, JS DOM get there getElementsByClassName, very convenient, but then, for compatibility with some browsers (you know). Only the lower package. Solutions are as follows

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>getElementsByClassName 封装</title>
</head>

<body>
    <div class="item">item1</div>
    <div class="item">item2</div>
    <div class="item">item3</div>
    <div class="item">item4</div>
    <div class="item">item5</div>
    <div class="item">item6</div>
</body>
<script>
    function getElementsByClassName(name, attrbuteName) {
        var arr = [];
        if (document.getElementsByClassName) {
            //If you support this property, direct access to 
            arr = document.getElementsByClassName (name) 
        } the else {
             // If not 
            var attr = attrbuteName attrbuteName:? " * " ; /// If you specify a label with the name of the 
            var tagNameArr = document.getElementsByTagName ( attr);
             for ( var index = 0 ; index <tagNameArr.length; index ++ ) {
                 var classNameArr tagNameArr = [index] .className.split ( "  " )
                 for ( var J =0; j < classNameArr.length; j++) {
                    if (classNameArr[j] === name) {
                        arr.push( tagNameArr[index])
                    }

                }
            }
        }
        return arr;
    }
    getElementsByClassName("item","div")[0].style.color = "red"
</script>

</html>

 

Guess you like

Origin www.cnblogs.com/huzhuhua/p/11106410.html