zoukankan      html  css  js  c++  java
  • js学习笔记15----子节点和兄弟节点的操作

    1.元素.firstChild : 只读属性,第一个子节点

      标准下:会包含文本类型的子节点。

      非标准下:只包含元素类型子节点。

    元素.firstElementChild : 只读属性,第一个元素子节点,等价于元素.children[0]

      标准和非标准下都是获取第一个元素子节点。

    2.元素.lastChild : 只读属性,最后一个子节点

    元素.lastElementChild : 只读属性,最后一个元素子节点

    3.元素.nextSibling: 只读属性,下一个兄弟节点

    元素.nextElementSibling: 只读属性,下一个兄弟元素节点

    4.元素.previousSibling: 只读属性,上一个兄弟节点

    元素.previousElementSibling: 只读属性,上一个兄弟元素节点

    兼容写法:

    <!DOCTYPE html>
    <html>
    <head>
        <title>元素兼容</title>
    </head>
    <body>
        <ul id="ul1">
            <li>111111</li>
            <li>222222</li>
            <li>333333</li>
            <li>444444</li>
        </ul>
        <script type="text/javascript">
            var oUl = document.getElementById('ul1');      
            var oFirst = oUl.firstElementChild || oUl.firstChild;
            var oLast = oUl.lastElementChild  || oUl.lastChild ;
            var oNext = oFirst.nextElementSibling || oFirst.nextSibling;
            var oPrev = oLast.previousElementSibling || oLast.previousSibling;
            oFirst.style.backgroundColor = 'red';
            oLast.style.backgroundColor = 'blue';
            oNext.style.backgroundColor = 'pink';
            oPrev.style.backgroundColor = 'brown';
        </script>
    </body>
    </html>
  • 相关阅读:
    6. 复习complex类的实现过程
    英文文献写作注意事项
    5. 操作符重载与临时对象
    4. 参数传递与返回值
    3. 构造函数
    JSON之Asp.net MVC C#对象转JSON,DataTable转JSON,List<T>转JSON,JSON转List<T>,JSON转C#对象
    JSON.NET 使用技巧
    异常处理 Exception
    HTTP报文
    HttpWebRequest类
  • 原文地址:https://www.cnblogs.com/sese/p/6398611.html
Copyright © 2011-2022 走看看