DOM（文档对象模型）

于 2023-04-26 16:45:15 发布
阅读量300 收藏
点赞数
文章标签： javascript 前端 html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Johnsonnet/article/details/130388376
版权
DOM（文档对象模型）是将HTML网页转化为JS可编辑对象的工具，允许JavaScript操作网页内容。DOM由节点构成，形成树状结构，包括Document、Element、Attribute和Text等节点类型。访问DOM的方法包括getElementById、getElementsByClassName、getElementsByTagName、querySelector和querySelectorAll等。
摘要由CSDN通过智能技术生成

一、什么是DOM？

简单来说，DOM是一个工具，它将HTML网页转化为可供JS编辑的对象，从而实现对于网页内容的增删操作。英文全称Document Object Model.

从英文全称入手，从三个单词的方向来解释DOM:

Document(文档）:具体所指示的就是整个HTML网页的文档，也就是用于操作的文本内容。

Object(对象）：将网页中任意的一个元素都看作一个对象，就类似于写HTML时我们所使用的各种类型的标签就是一个小小的对象，感觉更接近于ID类型。

Model（模型）：使用模型来表示对象之间的关系。

JS是用来优化、美化网页的效果的工具，但是其不能直接对于网页中的各种元素进行修改美化，需要使用DOM作为工具来使JS能够正常地发挥作用。

二、DOM的最小组成单位——节点

节点有很多种类型，各个类型的节点彼此之间相互有着某种关系，这些关系构成了层级，最终构成了树状结构。

Document节点是每一种文档的根节点（个人理解：毕竟叫Document，所有的文件都一定是文件）。

对于一个HTML文档

根节点唯一的子节点是<html>(文档元素：包裹在一个文档最外层的一个元素，故只存在一个） 

常见的节点类型有如下几种：（或许也可以理解为数据类型）

Document&#

最低0.47元/天 解锁文章
Johnsonnet
关注
DOM（文件对象模型）
gym21的博客
06-21 2409
DOM （ Document Object Model ，文档对象模型），是用来呈现以及与任意 HTML 或 XML 文档交互的API （ Application Program Interface ，应用程序接口）。 DOM 是载入到浏览器中的文档模型，以节点树的形式来表现文档，每个节点代表文档的构成部分（例如：页面元素、字符串或注释等等）。...
DOM文档对象模型
qq_42839746的博客
09-13 682
DOM的英语全称为Document Object Model,翻译成中文就 是文档对象模型。也就是说，将整个文档看作是一个对象。而一个文档又是由很多节点组成的， 那么这些节点也可以被看作是一个个的对象。DOM里面的对象属于宿主对象，需要浏览器来作 为宿主。一旦离开了浏览器这个环境，那么该对象将不复存在。同样，上一章我们所介绍的 BOM也是如此，需要浏览器来作为宿主，所以它也是一个宿主对象。
详解PHP使用DOMDocument类遍历、增加、修改、删除XML节点操作
herion_liu的博客
06-07 1170
Dom（Document object model）文档-对象-模型，核心思想是把一个Xml文件看成一个对象模型，然后通过对象的方式来操作Xml文件。我们先总结出DOM对象的属性方法，在分别用案例说明其应用！DOMDocument 属性：Attributes存储节点的属性列表(只读) childNodes存储节点的子节点列表(只读) dataType返回此节点的数据类型 Definition以
dom文档
Funnywaluntai的博客
04-24 801
dom 选择器 作用：选中html元素，在js中以对象形式存在， js通过对dom对象下属性多次赋值，以及api使用，完成页面动画 注意：选择器返回值，有的是dom对象，有的集合，如果是集合，需要从集合中取值获取dom对象 document.api document.getElementById() document.getElementsByClassName(); document.getElementsByTagName(); document.querySelector() document.
Dom解析文件
chuck_phonics的博客
08-17 279
1.导入GDataXMLNode第三方框架 2.进行环境配置 3.在appdelegata中设置导航以及根目录 4.viewcontroller中代码如下 // // ViewController.m // DOM解析分区 // #import "ViewController.h" #import "GDataXMLNode.h" #import "Student.h" @in...
Dom（十九） 文件
Oliver尹的博客
08-31 507
File对象 最常见的功能就是头像上传，文件预览，文件上传这些类似的功能 input上的type='file'，就可以实现选择文件功能 先看一个示例 &lt;div class="div-a"&gt; &lt;input type="file" id="file" class="div-input"&gt; &lt;
常用手册 DOM文档对象模型.chm
05-25
通过阅读《常用手册 DOM文档对象模型》，开发者不仅可以深入理解DOM的基本概念，还能掌握实际操作DOM的技巧，从而提高网页和应用程序的交互性和动态性。此外，对于学习前端开发和Web应用的人员来说，这是一份非常...
解析XML中的树形结构与DOM文档对象模型
09-24
以上知识点总结了XML中的树形结构和DOM文档对象模型的核心概念和用途，以及如何使用JavaScript来操作DOM以解析XML文档。这些知识点在前端开发、数据交换格式设计等领域具有广泛的应用，是每一位IT专业人员需要掌握的...
Dom文档对象模型-2010
08-15
Dom文档对象模型-2010版，对各种Dom 模型进行介绍，转载自 web圈。 Dom文档对象模型-2010版，对各种Dom 模型进行介绍，转载自 web圈。 Dom文档对象模型-2010版，对各种Dom 模型进行介绍，转载自 web圈。
DOM 文档对象模型
fang392的博客
03-29 284
文档：DOM中的“D” D即document，当我们想要创建一个网页并把它加载到Web浏览器中，这个时候就需要用到DOM，它把我们编写的网页文档转换成一个文档对象。 对象：DOM中的“O” O即object，对象是一种自足的数据集合，与某个特定的对象相关联的变量称为这个对象的属性，只能通过某个特定的对象去调用的函数称为这个对象的方法。 var obj = {name:"Tom",age:20, fullName : function() { return this.name;
DOM
努力让自己幸运...
07-08 765
DOM节点类型 类型 nodeType nodeName nodeValue 元素节点 1 node 标签名称 文本节点 3 #text 文本内容 注释节点 8 #comment 注释内容 属性节点 2 属性名 属性值 Document 对象 document 对象是 HTMLDocument 的一个实例，表示整个 HTML 页面。而且 document 是 win...
DOM（文档对象类型）
Kelly_3的博客
04-29 455
DOM用于将文档中对象按照树形结构组织起来，用户能够方便地通过DOM获取元素、遍历元素、修改和创建元素、设置元素属性、进行事件监听和处理。 什么是DOM DOM（Ducument Object Model，文档对象模型）用于将HTML文档描述成文档对象，该对象被组织成由一个个 节点（Node） 组成的 树形结构。树中节点有元素节点、属性节点、文本节点等。节点之间存在父子、兄弟等层级关系，每个节点有自己的名称、类型以及其他一些属性。同时DOM提供了一系列节点操作相关的 API，用于访问和处理元素。 DOM的作
DOM(文档对象模型)
JustinNeil的博客
06-04 1476
DOM概念 当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model）。 HTML DOM 模型被构造为对象的树 通过可编程的对象模型，JavaScript 获得了足够的能力来创建动态的 HTML。 JavaScript 能够改变页面中的所有 HTML 元素 JavaScript 能够改变页面中的所有 HTML 属性 JavaScript 能够改变页面中的所有 ...
DOM——文件对象模型 (获取元素的方式、操作元素的属性——点击事件操作页面、文档树中的节点们进行——增删改查、克隆 删除)
qq_52301431的博客
07-14 526
DOM是documentobjectmodel它是W3C产业联盟制定的浏览器对程序员提供的对HTML文档操作的接口把文档中的代码翻译成一个对象模型在这个模型中所有相关的标签属性注释文本等等12种数据都翻译为一种类型的对象统称这些对象之间在文档模型数据结构中存在某种关系根节点父子节点同胞节点等等1.只有一个根节点document2.除了根节点外所有节点都有唯一的一个父节点3.document是window对象的属性。......
W3CDom操作XML文档实用工具类
CGS666的博客
03-10 549
W3CDom操作XML文档实用工具类
DOM解析XML文件
aaabc1112345的博客
10-09 173
DOM解析XML文件 　　dom(Document Object Model) 文档对象模型。 　　DOM中主要包括五个对象： 　　　　Document、Node、NodeList、Element、Attr下面对这五个元素一一分析： 　　1，Document对象代表了整个xml文档，xml所有的node都按一定的顺序在document对象中排列成树结构，通过遍历该对象得到我们想要...
DOM是什么
qq_21205435的专栏
03-12 1124
DOM 解释:文档对象模型（Document Object Model，简称DOM），是W3C组织推荐的处理可扩展标志语言的标准编程接口。           包括DOM、XML DOM、HTML DOM。     DOM DOM 是 W3C（万维网联盟）的标准。 DOM 定义了访问 HTML 和 XML 文档的标准： "W3C 文档对象模型 （DOM） 是中立于平台和语言
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值