解决 IE 不支持 document.getElementsByClassName()

来源:互联网 发布:c语言课程设计单词统计 编辑:程序博客网 时间:2024/05/17 04:00
<!DOCTYPE html><html>   <head>      <meta charset="UTF-8">      <title></title>      <style type="text/css">         div {            width: 400px;            height: 50px;            margin: 10px 0;         }         .c {            border: 1px solid red;         }         .c1 { border: 1px solid green; }         .c2 { border: 1px solid blue; }      </style>      <script type="text/javascript">         //className是类名.results是返回的数组         var getClass=function(Class,results){            results =results || [];            var tempArr,i;            //1.首先判断系统所提供的方法是否可以实现该功能            if(document.getElementsByClassName){               results.push.apply(results,document.getElementsByClassName(Class));            }else{               //2.自定义实现,               //思路:首先获取所有元素,然后在元素中搜索符合要求的,再加入到数组中               tempArr = document.getElementsByTagName('*');               //(1)for循环,判断是否符合要求               for(var i=0; i < tempArr.length; i++){                  //注意,className属性需要验证非空                  var list = tempArr[i].className.split(' ');                  for (var j=0;j<list.length;j++){                     if(list[j]===Class){                        results.push(tempArr[i]);                        break;                     }                  }               }            }            return results;         };      </script>   </head>   <body>      <div class="c1 c2"></div>      <div class="c2"></div>      <div class="c"></div>      <div class="c1"></div>   </body>   <script>      //实验      var list =getClass('c1');      for(var k in list){         list[k].style.backgroundColor='pink';      }   </script></html> 
0 0