• js原生封装getClassName()方法-ie不支持getElementsByClassName,所以要自己实现获取类名为className的所有元素


      

    <html>
    <head>
    <script type="text/javascript">
    
    window.onload = function()
    {   var topMenus = getClass('li','topMenu');
        for(var i=0;i < topMenus.length; i++)
        {
            alert(topMenus[i].innerHTML);        
        }
    
    }
    
    function getClass(tagName,className) //获得标签名为tagName,类名className的元素
    {
        if(document.getElementsByClassName) //支持这个函数
        {        return document.getElementsByClassName(className);
        }
        else
        {       var tags=document.getElementsByTagName(tagName);//获取标签
            var tagArr=[];//用于返回类名为className的元素
            for(var i=0;i < tags.length; i++)
            {
                if(tags[i].class == className)
                {
                    tagArr[tagArr.length] = tags[i];//保存满足条件的元素
                }
            }
            return tagArr;
        }
    
    }
    
    
    
    </script>
    
    </head>
    <body>
    
    <ul id="nav">
    <li class="topMenu"><a href="#">产品介绍</a>
        <ul class="subMenu">
            <li><a href="#">产品1</a></li>
            <li><a href="#">产品2</a></li>
            <li><a href="#">产品3</a></li>
            <li><a href="#">产品4</a></li>
            <li><a href="#">产品5</a></li>
            <li><a href="#">产品6</a></li>
        </ul>
    </li>
    <li class="topMenu"><a href="#">服务介绍</a>
        <ul class="subMenu">
            <li><a href="#">服务1</a></li>
            <li><a href="#">服务2</a></li>
            <li><a href="#">服务3</a></li>
            <li><a href="#">服务4</a></li>        
        </ul>
    </li>
    <li class="topMenu"><a href="#">成功案例</a>
        <ul class="subMenu">
            <li><a href="#">案例1</a></li>
            <li><a href="#">案例2</a></li>
            <li><a href="#">案例3</a></li>
            <li><a href="#">案例4</a></li>
        </ul>
    </li>
    <li class="topMenu"><a href="#">关于我们</a>
        <ul class="subMenu">
            <li><a href="#">我们1</a></li>
            <li><a href="#">我们2</a></li>
            <li><a href="#">我们3</a></li>
            <li><a href="#">我们4</a></li>
        </ul>
    </li>
    <li class="topMenu"><a href="#">联系我们</a>
        <ul class="subMenu">
            <li><a href="#">联系1</a></li>
            <li><a href="#">联系2</a></li>
            <li><a href="#">联系3</a></li>
            <li><a href="#">联系4</a></li>
            <li><a href="#">联系5</a></li>
            <li><a href="#">联系6</a></li>
            <li><a href="#">联系7</a></li>
        </ul>
    </li>
    
    </ul>
    </body>
    </html>
    复制代码

    注意getElementsByClassName和getElementsByTagName都有s;

    js中不能用int a=1;要用var a=1;

  • 相关阅读:
    php注释规范
    Jquery元素选取、常用方法
    pdo 添加数据
    pdo 访问数据库
    session / cookie 区别与应用
    注册审核
    分页 --条件查询再分页
    Python 第二十九章 socket通信
    Python 第二十八章 网络初识+五层协议+三次握手四次挥手
    Python 第二十六章 面向对象 元类+反射+双下方法
  • 原文地址:https://www.cnblogs.com/koleyang/p/4891228.html
Copyright © 2020-2023  润新知