用原生JS擷取CLASS對象

來源:互聯網
上載者:User

標籤:jquery   ui   web前端   前端   架構   

聽說是最常用。。。。我是看了dom編程藝術想到的。 精心開發5年的UI前端架構!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">     <html xmlns="http://www.w3.org/1999/xhtml">     <head>     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />     <title>無標題文檔</title>     <style>     .ca{background-color:red; padding:20px;}     .js{ border:1px solid #00F; padding:10px;}     </style>     </head>        <body>     <div class="ca">     sss     </div>     <div class="js" id="as">     </div>     <div class="bd">     </div>     <div class="ca">     </div>     </body>     </html>     <script>     function getElementsClass(classnames){  var classobj= new Array();//定義數組     var classint=0;//定義數組的下標     var tags=document.getElementsByTagName("*");//擷取HTML的所有標籤     for(var i in tags){//對標籤進行遍曆     if(tags[i].nodeType==1){//判斷節點類型     if(tags[i].getAttribute("class") == classnames)//判斷和需要CLASS名字相同的,並組成一個數組     {     classobj[classint]=tags[i];     classint++;     }     }     }     return classobj;//返回組成的數組     }        //以下就是測試了     var a=getElementsClass("ca");     a[0].onclick=function(){alert("我們來了");}     a[1].innerHTML='我們來了';     </script>
 

有時候會有多個dom的class相同,可以這樣處理: 精心開發5年的UI前端架構!

var a=getElementsClass("ca"); for(var i=0;i<a.length;i++){ (function(i){ alert(a[i]) })(i) }
  

 

如果有多個相同的class也可以一起用了,如果是想達到JQ哪裡可以直接.click還需要做一些比較複雜的處理

用原生JS擷取CLASS對象

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.