JavaScript选取元素子节点的方法

1.5k 前端 发表评论

JavaScript选取元素子节点的方法:

<script>
    function getChildElements(ele,tagName){//获取ele对象的元素子节点
        if(!(ele&&ele.nodeType&&ele.nodeType===1))//传进来的对象是一个元素类型的DOM节点才行,否则退出
            return false
        var child=ele.firstChild;//从第一个节点开始判断
        var a=[]
        if(tagName){//参数是可选的,如果第二个参数传进来了
            while(child){
                if(child.nodeType==1&&child.tagName.toLowerCase()==tagName.toLowerCase()){
                    a.push(child);
                }
                child=child.nextSibling;//判断完这个节点就判断下一个节点
            }
        }else{//如果第二个参数没有传
            while(child){
                if(child.nodeType==1){
                    a.push(child);
                }
                child=child.nextSibling;
            }
        }
        return a//最后别忘把此数组返回
    }
</script>

HTML代码:

<div id="p1">
    <div class="a">1</div>
    <div class="b c a">1</div>
    <div class="aa b c">1</div>
    <p>aa</p>
    <span class="a">ssss</span>
    <span>ssss</span>
</div>

使用方法:

var ele=document.getElementById('p1');
 var a=getChildElements(ele,'span');//获取获取id为p1的这个元素标记名为span的子元素

 

参考资料:

  1. javascript选取元素子节点的方法–getChildElements

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

昵称 *