DOM概述

最新推荐文章于 2023-12-11 18:18:30 发布
最新推荐文章于 2023-12-11 18:18:30 发布
阅读量394 收藏
点赞数 1
文章标签： javascript 前端 html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_57126801/article/details/126510715
版权

DOM

DOM是JS操作网页的接口，全称为“文档对象模型”（Document Object Model）。它的作用是将网页转为一个JS对象，从而可以用脚本进行各种操作（比如增删内容）。
一个 web 页面是一个文档。这个文档可以在浏览器窗口或作为 HTML 源码显示出来。但上述两个情况中都是同一份文档。文档对象模型（DOM）提供了对同一份文档的另一种表现，存储和操作的方式。 DOM 是 web 页面的完全的面向对象表述，它能够使用如 JavaScript 等脚本语言进行修改。
简单来说就是：js可以通过DOM来完成对网页的结构，样式和内容进行改动。

节点

DOM的最小组成单位叫做节点（node）。文档的树形结构（DOM树），就是由各种不同类型的节点组成。每个节点可以看作是文档树的一片叶子。

  • 常用节点
    文档节点（document）

    ​ 整个HTML文档document对象作为window对象的属性存在的，我们不用获取可以直接使用。

    元素节点（Element）

    ​ HTML文档中的HTML标签。

    属性节点（Attribute)

    ​ 元素的属性 表示的是标签中的一个一个的属性，这里要注意的是属性节点并非是元素节点的子节点，而是元素节点的一部分。

    文本节点（Text）

    ​ HTML标签中的文本内容。

  • 其他节点
    DocumentType

    ​ doctype标签（比如<!DOCTYPE html>）。

    Comment

    ​ 注释

    DocumentFragment

    ​ 文档的片段

这七种节点都属于浏览器原生提供的节点对象(下面要讲的Node对象)的派生对象，具有一些共同的属性和方法。
一个文档的所有节点，按照所在的层级，可以抽象成一种树状结构。这种树状结构就是DOM。
在这里插入图片描述

yuayu121
关注
JavaScript【DOM概述、节点、节点树 、Node.nodeType属性 、document对象（属性、方法/获取元素、方法/创建元素）、Element对象属性】(十)
08-05 963
JavaScript【DOM概述、节点、节点树 、Node.nodeType属性 、document对象（属性、方法/获取元素、方法/创建元素）、Element对象属性】(十)
DOM(文档对象模型）
liu258159的博客
06-24 1795
DOM(文档对象模型）
DOM介绍
weixin_45116146的博客
09-23 2656
DOM是JS操作网页的接口，全称为“文档对象模型”（Document Object Model）。它的作用是将网页转为一个JS对象，从而可以用脚本进行各种操作（比如增删内容）。 DOM提供了一种表述形式将文档作为一个结构化的节点组以及包含属性和方法的对象。从本质上说，它将web页面和脚本或编程语言连接起来了。 DOM可以理解成网页的编程接口。 1.节点 DOM最小的单位叫做节点。文档的树形结构（DOM树），就是各种不同类型的节点组成的。 节点类型有七种：Document、DocumentTyp..
DOM
JASMINECJC的博客
02-29 593
DOM1级主要定义的是HTML和XML文档的底层结构。DOM2和DOM3级别则在这个结构的基础上引入了更多的交互能力，也支持了更高级的XML特性。为此DOM2和DOM3级分为许多模块（模块之间具有某种关联），分别描述了DOM的某个非常具体的子集。 这些模块如下： 1、DOM2级核心（DOM Level 2 Core）：在1级核心的基础上构建，为节点添加了更多方法和属性； 2、DOM2级视图（
dom概述
weixin_50088222的博客
08-02 137
把html页面或者是xml文件看成是一个文档,文档就是一个对象,这个文档中所有的标签都是元素,元素也可以看成是对象,标签(元素,对象)有很多,还有嵌套的关系,组成的这种层次结构,可以模拟成树形结构图,简称树状图,就是DOM树。节点网页中的所有内容都是节点（标签、属性、文本、注释），DOM中使用node表示。文档一个页面就是一个文档，DOM中使用document表示。元素页面中所有标签都是元素，DOM中使用element表示。DOM把以上内容都看作是对象。...
DOM和BOM的使用
01-08
DOM 概述 DOM 是一个文档对象模型，它将 HTML 文档抽象为一个树形结构，允许开发者通过 JavaScript 操作文档的内容和结构。DOM 提供了许多方法和属性，开发者可以通过这些方法和属性来操作文档的内容和结构。 ...
theroomjs:香草javascript插件，可让您概述dom元素，例如网络检查器
05-12
香草javascript插件，可让您概述DOM元素（如Web检查器）的轮廓。 theroomjs可以作为theRoom全局访问。 它与现代浏览器兼容，例如Google Chrome，Mozilla Firefox，Safari，Edge和Internet Explorer。 选项 名称 ...
增量域：一个就地DOM差异库
02-24
概述 增量DOM是用于建立DOM树并在数据更改时就地更新它们的库。 它与已建立的虚拟DOM方法的不同之处在于，没有创建任何中间树（现有树就地进行了变异）。 这种方法显着减少了内存分配和GC更新，从而对DOM树进行了...
DOM DOM概述
houyanhua1的专栏
11-09 1127
DOM的官方定义 DOM Document Object Model 文档对象模型。 DOM的官方定义：W3C的DOM，可以使程序或脚本(JS或AS、JScript)，动态的访问或操作文档的内容、结构、样式。 DOM只是一个标准，就是操作网页的标准。而这个标准(模型)在浏览器中，以“对象”的方式实现。 DOM的分类 核心DOM：提供了操作HTML文档(显示)或XML文档(存储数据)的
DOM的概述
最新发布
weixin_75197203的博客
12-11 787
原神
我和DOM的两三事
weixin_30642267的博客
11-06 104
说明： 本文的主线和大部分内容均来自： http://www.blogjava.net/amigoxie/archive/2011/10/31/362367.html，原文写的很不错，本文只是在我看了原文后加了一些自己的理解。 其余参考内容来自： http://www.w3school.com.cn/htmldom/index.asp http://www.cnblogs.com/x11...
DOM简介
whl_1990的专栏
11-03 229
文档对象模型，针对HTML和XML文档的一个API；DOM描绘了一个层次化的节点树，开发人员可以增删改查页面的某一个部分。 1, 所有的对象都实现了Node节点，所有的Node节点都有nodeType、nodeName、nodeValue这三个属性，有12中nodeType： 元素element    1(标签)    属性attr       2(标签里面的属性)    文本te
DOM理论知识
liu537192的专栏
08-01 722
DOM:Document Object Model(文档对象模型) 用来将标记型文档封装成对象，并将标记型文档中的所有的内容(标签，文本，属性等)都封装成对象。 封装成对象的目的是为了更为方便的操作这些文档以及文档中的所有内容。 因为对象的出现就可以有属性和行为被调用。 文档对象模型 文档：标记型文档。 对象：封装了属性和行为的实例，可以被直接调用。 模型：所有标记型文档都具备一些共
DOM 概述
ln6833
08-22 578
DOM 概述网道（WangDoc.com），互联网文档计划【免费领取】廖雪峰老师历时三个月整理的《Vue 源码 + 3.0语法剖析教程》。目录 [隐藏] DOM 节点 节点树 DOM # DOM 是 JavaScript 操作网页的接口，全称为“文档对象模型”（Document Object Model）。它的作用是将网页转为一个 JavaScript 对象，从而可以用脚本进行各种操作（比如增删内容）。浏览器会根据 DOM 模型，将结构化文档（比如 HTML 和 XML）解析成一系列的节点，再由这些节点
DOM 简介
weixin_48376132的博客
07-05 9784
DOM 简介 1. DOM 概念 文档对象模型（Document Object Model，简称 DOM），是 W3C 组织推荐的处理可扩展标记语言的标准编程接口。 它是一种与平台和语言无关的应用程序接口(API)，它可以动态地访问程序和脚本，更新其内容、结构和 www 文档的风格(目前，HTML 和 XML 文档是通过说明部分定义的)。文档可以进一步被处理，处理的结果可以加入到当前的页面。 DOM 是一 种基于树的 API 文档，它要求在处理过程中整个文档都表示在存储器中。 总结：W3C 已经定义了一系列
DOM核心重点内容
weixin_64909978的博客
12-27 117
BOM和DOM
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值