1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>封装getElementsByClassName</title>
6 </head>
7 <body>
8 <div class="trsd demo">1111111111</div>
9 <div>2222222222</div>
10 <div class="demo">3333333333333</div>
11 <div>44444444</div>
12 <div>55555555555</div>
13 <div>6666666666666</div>
14 <div class="demo2 tssr demo">777777777777777</div>
15 <div>88888888888</div>
16 <div class="demo">999999999999999</div>
17 <div>0000000000000000</div>
18 <script>
19 function getClass(classname) {
20 if (document.getElementsByClassName) {
21 return document.getElementsByClassName(classname);
22 }
23
24 var $elements = document.getElementsByTagName('*');
25 var arr = [];
26 for (var i = 0, j = $elements.length; i < j; i++) {
27 //如果有多个类 需要用空格隔开
28 var dom = $elements[i].className.split(" ");
29 for (var k = 0, l = dom.length; k < l; k++) {
30 if (dom[k] == classname) {
31 arr.push($elements[i]);
32 }
33 }
34 }
35
36 return arr;
37 }
38
39 var test = getClass("demo");
40 console.log(test);
41 for(var i=0;i<test.length;i++){
42 test[i].style.background="#666";
43 }
44
45 </script>
46 </body>
47 </html>
