码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript封装节点兼容代码

时间:2018-07-27 01:17:14      阅读:136      评论:0      收藏:0      [点我收藏+]

标签:div   lang   支持   inner   rip   ack   function   java   else   

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<ul id="uu">
    <li>第一个</li>
    <li>第二个</li>
    <li>第三个</li>
    <li>第四个</li>
    <li>四五个</li>
</ul>
<script src="common.js"></script>
<script>
    //element.firstChild--->谷歌火狐获取的是第一个子节点
    //element.firstChild--->IE8获取的是第一个子元素
    //element.firstElementChild--->谷歌和火狐获取的是第一个子元素,IE8不支持
    //获取任意一个父级元素的第一个子级元素
    function getFirstElementChild(element) {
        if (element.firstElementChild) {//true 支持
            return element.firstElementChild;
        } else {
            var node = element.firstChild;//第一个子节点
            while (node && node.nodeType != 1) {
                node = node.nextSibling;
            }
            return node;
        }
    }

    //获取任意一个父级元素的最后一个子级元素
    function getLastElementChild(element) {
        if (element.lastElementChild) {
            return element.lastElementChild;
        } else {
            var node = element.lastChild;
            while (node && node.nodeType != 1) {
                node = node.previousSibling;
            }
            return node;
        }
    }

    //测试
    console.log(getFirstElementChild(my$("uu")).innerText);
    console.log(getLastElementChild(my$("uu")).innerText);
</script>
</body>
</html>

 

JavaScript封装节点兼容代码

标签:div   lang   支持   inner   rip   ack   function   java   else   

原文地址:https://www.cnblogs.com/cuilichao/p/9375074.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!