• DOM-BOM-EVENT(3)


    3.Node常用属性

    childNodes 获取所有子节点

    <div id="wrap">
        <div>1111</div>
        <div>2222</div>
        <div>3333</div>
        <div>4444</div>
        <div>5555</div>
    </div>
    <script>
        var oWrap = document.getElementById("wrap")
        // 打印wrap下面的所有子节点,返回一个集合,包含文本节点
        console.log(oWrap.childNodes)
        // 获取集合中的某一个
        console.log(oWrap.childNodes[1]) 
    </script>
    

    children 获取所有子节点中的元素节点

    var oWrap = document.getElementById("wrap")
    // 打印wrap下面的所有元素节点
    console.log(oWrap.children)
    // 获取集合中的某一个
    console.log(oWrap.children[1])  
    

    firstChild 获取第一个子节点

    var oWrap = document.getElementById("wrap")
    //返回第一个子节点
    console.log(oWrap.firstChild)
    

    lastChild 获取最后一个子节点

    var oWrap = document.getElementById("wrap")
    //返回最后一个子节点
    console.log(oWrap.lastChild)
    

    parentNode 获取父节点

    var oWrap = document.getElementById("wrap")
    //返回父节点
    console.log(oWrap.parentNode)
    

    previousSibling 获取上一个兄弟节点

    var oWrap = document.getElementById("wrap")
    // 获取第二个节点
    var nowNode = oWrap.children[1]
    //返回上一个兄弟节点
    console.log(nowNode.previousSibling)
    

    nextSibling 获取下一个兄弟节点

    var oWrap = document.getElementById("wrap")
    // 获取第二个节点
    var nowNode = oWrap.children[1]
    //返回上一个兄弟节点
    console.log(nowNode.nextSibling)
    

    参考文档

    Node - Web API 接口| MDN - Mozilla ParentNode.children - Web APIs | MDN

    螺钉课堂视频课程地址:http://edu.nodeing.com

  • 相关阅读:
    Android入门第六篇之ListView (一)
    mysql触发器的作用及语法
    查询记录时rs.previous()的使用
    Microsoft Visual C++ Runtime Library Runtime Error的解决的方法
    Ubuntu中编译链接Opencv应用的简便方式
    24点经典算法
    CMS系统简介(从简介到使用)
    编程学习资源
    Django是什么
    Thinkphp中的自动验证
  • 原文地址:https://www.cnblogs.com/dadifeihong/p/12028039.html
Copyright © 2020-2023  润新知