document.querySelectorAll遍历

document.querySelectorAll兼容性良好，在之前的项目中就其遍历方式出了错误，先做个小结:

1.for循环 传统遍历方法

for(var i= 0; i< document.querySelectopAll(".a").length; i ++){
        document.querySelectopAll(".a")[i].style.color= "red";
}

2.forEach方法

forEach方法可以遍历一个js数组

var arr= [1, 2, 3];

arr.forEach(arr, function(pre){})

兼容性: 均兼容，IE低版本不兼容，本人使用的是IE9

若不兼容，可手动扩展:

详情:http://blog.csdn.net/oscar999/article/details/8671546

if (!Array.prototype.forEach) {
    Array.prototype.forEach = function(callback, thisArg) {
        var T, k;
        if (this == null) {
            throw new TypeError(" this is null or not defined");
        }
        var O = Object(this);
        var len = O.length >>> 0; // Hack to convert O.length to a UInt32
        if ({}.toString.call(callback) != "[object Function]") {
            throw new TypeError(callback + " is not a function");
        }
        if (thisArg) {
            T = thisArg;
        }
        k = 0;
        while (k < len) {
            var kValue;
            if (k in O) {
                kValue = O[k];
                callback.call(T, kValue, k, O);
            }
            k++;
        }
    };
}

如果这样使用:

document.querySelectorAll(".aa").forEach(function(){
  　　console.log("1")  　　
})

会报错，应为document.querySelectorAll(".aa")是一个NodeList数组，不是一般js数组！

可以借助call来实现

[].forEach.call(document.querySelectorAll(".aa"), function(){　

　　console.log("1")　　　　　　　

})；