请选择 进入手机版 | 继续访问电脑版
提问

IE不支持getElementsByClassName最终完美解决方案

  © 程序员  / 倒序浏览
  © 本页面所有内容均为注册会员发布,若有侵权,请发邮件至:weixunnet@vip.qq.com

#楼主# 2019-6-18

跳转到指定楼层
目前可以这么解决,判断浏览器支不支持这个方法,如果支持就不管;如果不支持,就在document对象里加入getElementsByClassName这个方法,按兴趣的朋友可以了解下
目前可以这么解决,判断浏览器支不支持这个方法,如果支持就不管;如果不支持,就在document对象里加入getElementsByClassName这个方法,这样的写法有一个好处,即不管有没有原生函数你都不用去修改代码。 通常先使用getElementsByTagName("*")取出文档中所有元素,然后进行遍历,使用正则表达式找出匹配的元素放入一个数组返回。由于IE5不支持document.getElementsByTagName("*"),要使用分支document.all以防错误
下面的方法完美支持了document写法
  1. if(!document.getElementsByClassName){
  2. document.getElementsByClassName = function(className, element){
  3. var children = (element || document).getElementsByTagName('*');
  4. var elements = new Array();
  5. for (var i=0; i<children.length; i++){
  6. var child = children[i];
  7. var classNames = child.className.split(' ');
  8. for (var j=0; j<classNames.length; j++){
  9. if (classNames[j] == className){
  10. elements.push(child);
  11. break;
  12. }
  13. }
  14. }
  15. return elements;
  16. };
  17. }
复制代码
最终的方案为:
  1. var getElementsByClassName = function (searchClass, node,tag) {
  2. if(document.getElementsByClassName){
  3. var nodes = (node || document).getElementsByClassName(searchClass),result = [];
  4. for(var i=0 ;node = nodes[i++];){
  5. if(tag !== "*" && node.tagName === tag.toUpperCase()){
  6. result.push(node)
  7. }else{
  8. result.push(node)
  9. }
  10. }
  11. return result
  12. }else{
  13. node = node || document;
  14. tag = tag || "*";
  15. var classes = searchClass.split(" "),
  16. elements = (tag === "*" && node.all)? node.all : node.getElementsByTagName(tag),
  17. patterns = [],
  18. current,
  19. match;
  20. var i = classes.length;
  21. while(--i >= 0){
  22. patterns.push(new RegExp("(^|\s)" + classes[i] + "(\s|$)"));
  23. }
  24. var j = elements.length;
  25. while(--j >= 0){
  26. current = elements[j];
  27. match = false;
  28. for(var k=0, kl=patterns.length; k<kl; k++){
  29. match = patterns[k].test(current.className);
  30. if (!match) break;
  31. }
  32. if (match) result.push(current);
  33. }
  34. return result;
  35. }
  36. }
复制代码
回复

使用道具

成为第一个回答人

B Color Link Quote Code Smilies
Archiver|手机版|小黑屋|翁笔
翁笔联系邮箱:weixunnet@vip.qq.com 本站服务器由二联网赞助提供