码迷,mamicode.com
首页 > 其他好文 > 详细

用原生dom的方法获取class对象(很简单实用)

时间:2015-01-24 15:44:32      阅读:128      评论:0      收藏:0      [点我收藏+]

标签:

话不多说,直接上代码,用的是for(var i in array)

 1 <!doctype html>
 2 <html>
 3 <head>
 4 <meta charset="utf-8">
 5 <title>用原生dom的方法获取class对象(很简单实用)</title>
 6 <style>
 7 .ca{background:red;padding:20px;}
 8 .js{border:1px solid #00f;padding:10px;}
 9 </style>
10 <script>
11 function getElementsClass(classnames){
12     var classobj = new Array();  //定义数组
13     var classint = 0; //定义数组的下标
14     var tags = document.getElementsByTagName(*);
15     for(var i in tags){ //对标签进行遍历
16         if(tags[i].nodeType == 1){ //判断节点类型
17             if(tags[i].getAttribute(class) == classnames){ //判断和需要class名字相同的,并组成一个数组
18                classobj[classint] = tags[i]; 
19                classint++;    
20             }
21         }
22     }
23     return classobj;  //返回组成的数组
24 }
25 window.onload = function(){
26        var a = getElementsClass(ca);
27     a[0].onclick = function(){alert(we are 伐木累);}
28     a[1].innerHTML =  we are 伐木累!;
29     var div = document.createElement(div);  // 创建一个div元素节点
30     var div_text = document.createTextNode(我是你的文本); //创建一个文本节点 
31     div.style.cssText = width:200px;height:300px;background:blue;color:white;  //设置最后添加的div的样式
32     div.appendChild(div_text);  //把文本加到div中
33     document.body.appendChild(div); //为body添加最后一个子节点,
34 }
35 </script>
36 </head>
37 
38 <body>
39 <div class="ca">
40 sosososo
41 </div>
42 <div class="js" id="as">
43 2</div>
44 <div class="bd">
45 3</div>
46 <div class="ca">
47 </div>
48 </body>
49 </html>

 

用原生dom的方法获取class对象(很简单实用)

标签:

原文地址:http://www.cnblogs.com/hl-520/p/4245886.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!