zoukankan      html  css  js  c++  java
  • 兼容IE8以下,获取className节点的元素(document.getElementsByClassName()兼容写法)。

    因为ie8一下不兼容 

                    document.getElementsByClassName()

                    功能:通过class的名字获取符合条件的元素

                    node.getElementsByClassName()

                    指定node节点下,符合条件的元素。

    所以我们自己封装一个兼容IE8以下,获取className节点的函数。

                //兼容IE8以下,获取className节点的元素。

                function elementsByClassName(node, className){

                    var res = [];//定义一个数组用来存class相同的节点

                    //1、查找node所有的子节点

                    var nodes = node.getElementsByTagName("*");

                    /*node.getElementsByTagName("*") 的意思是通过标签名查找所以node节点下所有的节点*为通配符*/

                    for(var i = 0; i < nodes.length; i++){//遍历每一个节点

                        if(nodes[i].className == className){//判断每一个节点的class属性名是否等于 传入的class名

                            res.push(nodes[i]);

                        }

                    }

    然后进行调用即可

            window.onload = function(){

                var oUl = document.getElementById('ul1')

                var node = elementByClassName(oUl, 'box');

                alert(node.length);//2

            }   

    html结构如下:

    <body>

            <ul id = 'ul1'>

                <li class = 'box'>11111111</li>

                <li>11111111</li>

                <li>11111111</li>

                <li class = 'box'>11111111</li>

            </ul>

            <ol>

                <li>22222222</li>

                <li class = 'box'>22222222</li>

                <li>22222222</li>

            </ol>    

    </body>

  • 相关阅读:
    腾讯课堂——基础数据类型(dict字典)
    腾讯课堂——基础数据类型(tuple元祖)
    基础数据类型(list列表)
    第 018讲:函数:灵活即强大(关键字函数,默认函数,收集函数)
    第 015讲:字符串:格式化
    第 013讲: 元组tuple 上了枷锁的列表
    第 012讲:打了激素的数组3
    第 011讲:一个打了激素的数组[02]
    range函数的用法
    第 010讲:一个打了激素的数组[01]
  • 原文地址:https://www.cnblogs.com/jxldjsn/p/11084513.html
Copyright © 2011-2022 走看看