DOM学习笔记

DOM被分为三个不同的部分:

  • 核心 DOM - 用于任何结构化文档的标准模型
  • XML DOM - 用于 XML 文档的标准模型
  • HTML DOM - 用于 HTML 文档的标准模型 

HTML DOM

HTML DOM 定义了所有 HTML 元素的对象和属性,以及访问它们的方法(接口)。

XML DOM

XML DOM 定义了所有 XML 元素的对象和属性,以及访问它们的方法(接口)。

HTML DOM:

根据 W3C 的 HTML DOM 标准,HTML 文档中的所有内容都是节点:

  • 整个文档是一个文档节点
  • 每个 HTML 元素是元素节点
  • HTML 元素内的文本是文本节点
  • 每个 HTML 属性是属性节点
  • 注释是注释节点 

节点树:



下面的图片展示了节点树的一部分,以及节点之间的关系:


一些常用的 HTML DOM 方法:

  • getElementById(id) - 获取带有指定 id 的节点(元素)
  • appendChild(node) - 插入新的子节点(元素)
  • removeChild(node) - 删除子节点(元素)
  • getElementsByTagName()-返回包含带有指定标签名称的所有元素的节点列表(集合/节点数组)。
  • getElementsByClassName()-返回包含带有指定类名的所有元素的节点列表。
  • createElement()-创建元素节点。

一些常用的 HTML DOM 属性:

  • innerHTML - 节点(元素)的文本值
  • parentNode - 节点(元素)的父节点
  • childNodes - 节点(元素)的子节点
  • attributes - 节点(元素)的属性节点
  • innerHTML 属性对于获取或替换 HTML 元素的内容很有用。


您将在本教程的下一章中学到更多有关属性的知识





  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值