zoukankan      html  css  js  c++  java
  • 如何根据元素的className获取元素?

    getElementsByClassName()是HTML5 新增的DOM API。IE8以下不支持
      我们知道,原生的方法,是getElementById()和getElementsByTagName(),这两个不会有兼容问题,但是遇到class的问题还是没法解决。所以这里总结两种封装方法,可以用它们来获取指定的class元素。当然,对于现代浏览器开发,还可以使用querySelector()和querySelectorAll(),他们的功能更加强大。

    1.数组遍历的方法:

    function getByClass(sClass,oParent){      
          var parent = oParent || document;
          var aEles = parent.getElementsByTagName('*');
          var arr = [];
          
          for(var i=0; i<aEles.length; i++){
              
              var aClass = aEles[i].className.split(' ');
             
             for(var j=0; j<aClass.length; j++){
                 if(aClass[j] == sClass){
                 
                     arr.push(aEles[i]);
                 }    
             }
         }
         return arr;
    }

    2.正则匹配的方法:

    function getElementsByClassName(oParent, sClass){
        var aEle = oParent.getElemnetsByTagName('*');
        var result = [];
        var re = new RegExp('\b' + sClass + '\b', 'i');
        
        for(var i=0; i<aEle.length; i++){
            if(re.test(aEle[i].className)){
                result.push(aEle);    
            }    
        }
        return result;
    }

    最后,值得一提是,前端页面实现中,性能的影响往往出现在DOM的操作中。此外,还要注意元素的回流和重绘问题。

    摘自:http://www.cnblogs.com/zhangxiaohang/p/5523157.html

  • 相关阅读:
    java8
    java7
    java6
    java5
    java复习4
    学习笔记
    Reflection笔记
    通过Reflection来获得方法和信息
    學習反射2
    學習反射1
  • 原文地址:https://www.cnblogs.com/hjbky/p/6230074.html
Copyright © 2011-2022 走看看