JS基础入门篇（二十四）—DOM（上）

Songlcy 发布于2019-08-30 15:53 / 810人阅读

摘要：常用的节点类型，，，。一句话这里是注释找到的父节点获取节点的一级的元素子节点，只获取元素，返回的是集合。

1.常用的节点类型，nodeType，attributes，childNodes。

1.元素节点 - 1
2.属性节点 - 2
3.文本节点 - 3
4.注释节点 - 8
5.文档节点 - 9

查看节点类型
    node.nodeType(返回的是数字)

属性节点
    元素.attributes(获取的是集合)
    元素.attributes[0]

通过元素.childNodes获取子节点
    childNodes 获取到的是一个集合
        集合中 包含了 元素的 所有子节点
            其中有 元素 子节点 ,注释,文本节点...

举例说明，以下是全部代码：




    
    Title
    


    
        inner
        一句话

2.nodeName


    
        inner
        一句话

3.parentNode,children,childNodes

node.parentNode：找到node的父节点
children：获取节点的一级的元素子节点，只获取元素，返回的是HTMLCollection集合。
childNodes：获取节点的一级子节点，可能获取到元素节点，文本节点，注释节点等，返回的是Nodelist集合.

举例说明，可以把代码粘贴，自己运行看看：

4.node.previousElementSibling和node.nextElementSibling

兄弟关系

    node.previousElementSibling 上一个元素兄弟节点
    node.nextElementSibling 下一个元素兄弟节点

举例说明，可以把代码粘贴，自己运行看看：

5.node.firstElementChild和node.lastElementChild

嵌套关系

    node.previousElementSibling 第一个子级
    node.nextElementSibling 最后一个子级

举例说明，可以把代码粘贴，自己运行看看：

GPU云服务器云服务器二十四第二十四 js零基础入门视频入门篇

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/116718.html

JS基础入门篇（二十四）—DOM（上）

摘要：常用的节点类型，，，。一句话这里是注释找到的父节点获取节点的一级的元素子节点，只获取元素，返回的是集合。 1.常用的节点类型，nodeType，attributes，childNodes。 1.元素节点 - 1 2.属性节点 - 2 3.文本节点 - 3 4.注释节点 - 8 5.文档节点 - 9 查看节点类型 node.nodeType(返回的是数字) 属性节点 ...

Amio 2019-08-22 18:02 评论0 收藏0
JS基础入门篇（二十四）—DOM（上）

摘要：常用的节点类型，，，。一句话这里是注释找到的父节点获取节点的一级的元素子节点，只获取元素，返回的是集合。 1.常用的节点类型，nodeType，attributes，childNodes。 1.元素节点 - 1 2.属性节点 - 2 3.文本节点 - 3 4.注释节点 - 8 5.文档节点 - 9 查看节点类型 node.nodeType(返回的是数字) 属性节点 ...

ChristmasBoy 2019-08-02 10:41 评论0 收藏0
JS基础入门篇（二十四）—DOM（下）

摘要：到定位父级节点的距离返回值是一个对象，包含了元素盒模型的详细信息可视大小取对象中详细的属性值相对于浏览器可视区域。移入移出效果移入当前数字，数字的前后背景变色。 1.offsetLeft/offsetTop offsetLeft/offsetTop : 到定位父级节点的距离. Title div{ padding...

bladefury 2019-08-02 16:02 评论0 收藏0
JS基础入门篇（二十四）—DOM（下）

摘要：到定位父级节点的距离返回值是一个对象，包含了元素盒模型的详细信息可视大小取对象中详细的属性值相对于浏览器可视区域。移入移出效果移入当前数字，数字的前后背景变色。 1.offsetLeft/offsetTop offsetLeft/offsetTop : 到定位父级节点的距离. Title div{ padding...

SmallBoyO 2019-08-29 15:43 评论0 收藏0
JS基础入门篇（二十四）—DOM（下）

摘要：到定位父级节点的距离返回值是一个对象，包含了元素盒模型的详细信息可视大小取对象中详细的属性值相对于浏览器可视区域。移入移出效果移入当前数字，数字的前后背景变色。 1.offsetLeft/offsetTop offsetLeft/offsetTop : 到定位父级节点的距离. Title div{ padding...

mcterry 2019-08-22 18:03 评论0 收藏0