zoukankan      html  css  js  c++  java
  • javascript getElementsByClassName扩展函数

    代码:

     function getElementsByClassName(){
        if(!arguments[0]){return []};//未指定任何参数,直接返回
        var args=arguments,
            a=args[0],//要查找的样式名称
            b=typeof(args[1])=='string' && args[1]||'*',//指定的标签
            c=((typeof(args[1])!='string' && args[1]) || args[2])||document,//在指定的容器内查找
            d=a.split(' '),//样式名称列表
            e=d.length,//待查找的样式总数
            f=e>1,//是否查找多个样式
            g={},//存储所有样式:for IE
            h=[];//最终对象存储
        if(f){
            for(var i=0;i<e;i++){
                g[d[i]]=!0;
            }
        }else{
            g[a]=!0;
        };
        if(document.all || (!document.all && f)){
            var o=c.getElementsByTagName(b);
            for(var i=0;i<o.length;i++){
                if(g[o[i].className]){
                    h.push(o[i]);
                }
            }
        }else{
            h=c.getElementsByClassName(a);//非IE标准浏览器:为保证元素的原有索引,仅在指定查找一个样式时使用此方法
        };
        return h;
    };

    用法:

    三个参数:
    1:待查找的样式,可指定多个,用空格分隔;未指定时直接返回
    2:[可选项]可指定查找的特定标签,默认为:遍历所有标签*
    3:[可选项]指定父容器,默认为:document
    可跳过第2个参数直接指定第3个参数。
    测试DOM:
    <div class="c">我在id=parent的层以外</div>
    <div id="parent">
        <div class="c">1</div>
        <div class="c">2</div>
        <div class="c">3</div>
        <div class="c">4</div>
        <div class="c">5</div>
        <div class="b">56</div>
        <div class="b">78</div>
        <span class="c">9</span>
    </div>
    //下面调用,仅返回parent内部,div的样式符合条件的元素
    var o=getElementsByClassName("c b",'div',document.getElementById('parent'));
    for(var i=0;i<o.length;i++){
        alert(o[i].innerHTML)
    };
    //下面调用,返回div的样式符合条件的元素
    var o=getElementsByClassName("c b",'div');
    for(var i=0;i<o.length;i++){
        alert(o[i].innerHTML)
    };
    //下面调用,仅返回parent内部,所有样式符合条件的元素
    var o=getElementsByClassName("c b",document.getElementById('parent'));
    for(var i=0;i<o.length;i++){
        alert(o[i].innerHTML)
    };
    //下面调用,返回所有样式符合条件的元素
    var o=getElementsByClassName("c b");
    for(var i=0;i<o.length;i++){
        alert(o[i].innerHTML)
    };
  • 相关阅读:
    Linux下磁盘监控及系统版本-CPU-内存等查看
    Linux目录结构详解
    Linux常用命令
    SecureCRT或XShell软件
    JMeter打开脚本失败 如何解决?
    JMeter常见错误解决方法
    Linux安装 火速入门
    浅谈我对持续集成的理解
    操作Frame和IFrame中页面元素
    弹出对话框的处理
  • 原文地址:https://www.cnblogs.com/zhangwei412827/p/3522520.html
Copyright © 2011-2022 走看看