DOM getElementsByClassName IE兼容方案
平时写HTML时多用class来命名，为很少用id来命名，主要原因就是class使用起来比较灵活。
但是万恶的JS在操作DOM的时候对ie6+只提供了getElementById和getElementsByTagName两个方法来查找DOM。
这时候就很尴尬了，就不得不在HTML里加入各种各样的id。看了就烦，不爽
Js有提供一个通过class名查找DOM的方法：getElementsByClassName();
但是。。。。。。只支持ie9+ -.-,哎呀好尴尬。。。
只好自己写一个兼容IE的getElementsByClassName()方法出来：
1 // indexOf兼容 2 if (!Array.prototype.indexOf) { 3 Array.prototype.indexOf = function(x) { 4 var result = -1; 5 if (this.length == 0) { 6 return result; 7 } 8 for (var i = 0; i < this.length; i++) { 9 if (this[i] === x) { 10 result = i; 11 break; 12 } 13 } 14 return result; 15 } 16 } 17 // getElementsByClassName兼容 18 if (!document.getElementsByClassName) { 19 document.getElementsByClassName = function(c_name, ele) { 20 //用于输出找到的匹配的DOM元素 21 var arr = []; 22 // 查找元素,并计算数组长度 23 var allTag = (ele || document).getElementsByTagName('*'); 24 var tagLength = allTag.length; 25 // 对传进来的c_name参数进行分割,并计算数组长度 26 var cNameList = c_name.split(' '); 27 var cNameLength = cNameList.length; 28 // 对所有的tag元素进行遍历 29 for (var i = 0; i < tagLength; i++) { 30 // 对每一个tag的class属性进行分割,并计算数组长度 31 var classList = allTag[i].className.split(' '); 32 var listLength = classList.length; 33 // 定义一个空数组 34 var judge = []; 35 for (var t = 0; t < cNameLength; t++) { 36 // 如果cNamelist可以在classList中找到，就给judge push一个true 37 if (classList.indexOf(cNameList[t]) !== -1) { 38 judge.push(true); 39 } 40 } 41 // 判断judge是否相等cNameLength，如果相等，表示是我们需要的元素 42 if (judge.length === cNameLength) { 43 arr.push(allTag[i]); 44 } 45 } 46 return arr; 47 } 48 }
1 <div id="box"> 2 <div class="one two"></div> 3 <div class="one three"></div> 4 <div class="one"></div> 5 <div class="one"></div> 6 </div> 7 <div class="one"></div> 8 <div class="one"></div>
这个兼容代码可以实现：
1. document.getElementsByClassName("one two");
只找到<div class="one two"></div>
2. document.getElementsByClassName("one");
找到所有div中存在class名为one的元素
3.document.getElementsByClassName("one",document.getElementById("box"));
找到box下的所有存在class名为one的元素
