zoukankan      html  css  js  c++  java
  • DOM之兄弟节点

    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>兄弟节点previousSibling</title>
    </head>
    <body>
    <ul id="ele">
            <li id='li1'>前端开发课程</li>
            <li id='li2'>javaScript课程</li>
            <li id="li3">HTML5课程</li>
            <li id="li4">CSS课程</li>
            <li id="li5">其它网站开发经典课程</li>
            <li id="li6">jQuery是其中的一部</li>   
    </ul>
    </body>
        <script type="text/ecmascript">
            function previousSibling(ele) {
                //先判断它支持不支持这个属性
                if (typeof previousElementSibling == 'object') {
                    //如果支持直接返回return ele.previousElementSibling;
                    return ele.previousElementSibling;
                } else {
                    //如果不支持就返回  ele.previousSibling
                    //元素的父节点
                    ele.previousSibling
                    //判断元素的哥哥节点,循环
                    do {
                        if (ele.previousSibling&&ele.previousSibling.nodeType=="1") {
                            return ele.previousSibling
                        }else{
                            ele = ele.previousSibling;
                        }
                    } while (ele)
                    return null;
                }

            }
            var oLi1 = document.getElementById("ele").children[0];
            var pre=previousSibling(oLi1)
            alert(pre)//弹出null

            //var oLi1 = document.getElementById("ele").children[1];
            //var pre = previousSibling(oLi1)
            //alert(pre)//弹出objectHTMLLIElement
        </script>
    </html>

  • 相关阅读:
    百度网盘免费下载加速
    linux docker 知识点总结
    openwrt 支持 EC200T
    openwrt 如何添加新设备支持
    openwrt DEPEND
    menuconfig kconfig
    golang 汇编
    按值传递
    YAPI认证用户利用Mock功能远程代码执行事件通告
    携程持久化KV存储实践
  • 原文地址:https://www.cnblogs.com/xiaoleidiv/p/3291298.html
Copyright © 2011-2022 走看看