<!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" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title>Document</title> <script> window.onload=function() { // var dom=document.getElementsByClassName("demo"); //浏览器兼容问题,ie6,7,8,不支持 // alert(dom.length); //封装自己的classname类名 function getclass(classname) { if(document.getElementsByClassName) //浏览器兼容的话,直接返回,错误写法document.getElementsByClassName(classname) { // var dom=document.getElementsByClassName(classname); // console.log(dom.length); return document.getElementsByClassName(classname); //兼容的话直接返回 } //浏览器不兼容的话 var obj=document.getElementsByTagName("*"); //取出所有的盒子,一一遍历 var arr=[]; //定义一个数组存放满足类名的盒子 for(var i=0;i<obj.length;i++) //遍历所有的盒子 { if(obj[i].className==classname) { arr.push(obj[i]); //不加引号 所有和classname相同类名盒子放进这个数组 } } return arr; } console.log(getclass("demo").length); //结果是3 } </script> </head> <body> <div class="demo"></div> <div></div> <div class="demo"></div> <div></div> <div></div> <div></div> <div class="demo text"></div> <div></div> <div></div> <div class="demo"></div> </body> </html>