JavaScript DOM对象

本文详细介绍了DOM树中元素、属性和文本节点的类型,以及节点间的父子、同级关系。同时,讲解了W3C定义的CoreDOM、XMLDOM和HTMLDOM接口。此外,还阐述了如何查看和操作节点,包括获取节点信息、查找子节点、修改删除属性、查找兄弟节点以及创建和增加节点的方法。这些内容对于理解DOM操作至关重要。
摘要由CSDN通过智能技术生成

一、DOM树中的节点类型和节点关系

        1、节点类型

                1、元素节点   1

                2、属性节点   2

                3、文本节点    3

        2、节点关系

                父子关系和同级关系

二、W3C规定的三类DOM标准接口

        1、Core DOM(核心DOM),适用于各种结构化文档

        2、XML DOM,专用于XML文档

        3、HTML DOM,专用于HTML文档

三、查看节点

        1、节点node

                1、obj.nodeName  节点名称

                2、obj.nodeType   节点类型

                3、obj.nodeValue  节点内容

        2、通过父节点对象查找子节点对象(可能会有文本节点 换行)

                父节点对象.firstChild   查找父节点下的第一个子节点

                父节点对象.lastChild   查找父节点下的最后一个子节点

                父节点对象.childNodes  查找父节点下的所有子节点

        3、通过父节点对象查找子元素节点对象

                父节点对象.firstElementChild  查找父节点下的第一个子元素节点

                父节点对象.lastElementChild  查找父节点下的最后一个子元素节点  

                父节点对象.children   查找父节点下的所有子元素节点

        4、通过子节点对象查找父节点对象

                子节点对象.parentNode  通过子节点查找父节点

                子节点对象.parentElement   通过子节点查找父元素

        5、查看修改删除属性节点

                节点对象.getAttribute("属性名"); 根据属性名获取属性值

                节点对象.setAttribute("属性名","属性值"); 添加属性名属性值

                节点对象.removeAttribute("属性名"); 删除对应的属性

        6、查找兄弟节点

                obj.nextSibling 查找下一个兄弟节点  可能为文本

                obj.nextElementSibling 查找下一个元素兄弟节点

                obj.previousSibling 查找上一个兄弟节点 可能为文本

                obj.previousElementSibling 查找上一个元素兄弟节点

        7、创建和增加节点的方法

                document.createElement(""); 增加元素节点

                父节点对象.appendChild(); 追加元素对象到父元素中最后

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

时光流逝·

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值