重写getElementsByClassName函数
由于IE6/7/8不支持getElementByClassName方法,所以编写一个兼容的新函数如下:
<!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> </head> <body> <div id="example"> <p id="p1" class="aaa bbb">1</p> <p id="p1" class="aaa ccc">2</p> <p id="p1" class="ccc bbb">3</p> </div> <script type="text/javascript"> function getElementsByClassName(element,names){ if(element.getElementsByClassName){ return element.getElementsByClassName; }else{ var elements = element.getElementsByTagName("*"); var result=new Array(); var classNames_str,flag; var name=names.split(" "); for(var i=0;i<elements.length;i++){ if(!elements[i].className)continue; classNames_str=""+elements[i].className; flag=true; for(var j=0;j<name.length;j++){ if(classNames_str.indexOf(name[j])==-1){ flag=false; break; } } if(flag==true) result.push(elements[i]); } //alert(result.length); return result; } } var a=document.getElementById("example"); window.onload=getElementsByClassName(a,"aaa bbb"); </script> </body> </html>
此函数实现了
- getElementsByClassName(example, “aaa”); 运行结果为包含id为p1, id为p2的元素列表
- getElementsByClassName(example, “bbb ccc”);运行结果为包含id为p3的元素列表
- getElementsByClassName(example, “ccc bbb”);运行结果为包含id为p3的元素列表