• 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>
  • 相关阅读:
    双六
    除法取模
    欧拉函数及费马小定理
    基础模运算
    Leeetcode--581. Shortest Unsorted Continuous Subarray
    Codeforces Round #541--1131F. Asya And Kittens(基础并查集)
    leetcode--200. Number of Islands
    leetcode--21. Merge Two Sorted Lists
    leetcode--155. Min Stack
    Codeforces Round #539--1113B
  • 原文地址:https://www.cnblogs.com/sese/p/6398611.html
Copyright © 2020-2023  润新知