JavaScript（六）

最新推荐文章于 2022-11-25 15:09:35 发布
最新推荐文章于 2022-11-25 15:09:35 发布
阅读量138 收藏
点赞数
文章标签： 简单工厂模式 javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_73646899/article/details/127024125
版权

文档对象DOM

一、DOM对象简介

什么是DOM对象

DOM(Document Object Model 文档对象模型)可以完成HTML和XML文档的操作，在JavaScript中利用DOM操作HTML和CSS样式是最常用的样式之一。DOM对JavaScript是一种可操作HTML文档得重要手段。利用DOM可完成对HTML文档内所有元素的获取、访问、标签属性和样式的设置等操作。

DOM HTML 节点树

根据 W3C 的 HTML DOM 标准，HTML 文档中的所有内容都是节点：
1、整个文档是一个文档节点
2、每个 HTML 元素是元素节点
3、HTML 元素内的文本是文本节点
4、每个 HTML 属性是属性节点
5、注释是注释节点
下面以<head>、<body>、<html>节点为例进行介绍
（1）根节点：<html>标签是整个文档的根节点，有且仅有一个。
（2）子节点：指的是某个节点的下级节点，例如·<head>和<body>节点是<html>节点的子节点。
（3）父节点：指的是某个节点的上级节点，例如<html>是<head>和body的父节点
（4）兄弟节点：两个节点同属于一个父节点，例如<head>和<body>互为兄弟节点

一个HTML文件可以看作是所有元素组成的一个节点树，各元素节点之间有级别的划分

<!DOCTYPE html>
<html>
    <head>
        <meta charset=

最低0.47元/天 解锁文章
咕噜噜爱喝水
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
javaScript中DOM的相关用法（DOM文档对象模型、document对象、获取html元素、操作元素内容、操作css样式、操作属性）
qq_56756602的博客
08-27 866
DOM的相关用法（DOM文档对象模型、document对象、获取html元素、操作元素内容、操作css样式、操作属性）
JavaScript学习笔记(第七章—DOM)
qq_45585500的博客
09-27 713
JavaScript学习笔记(第七章—DOM) 1、DOM对象简介 1.1 什么事DOM对象 DOM(Document Object Model 文档对象模型)可以完成HTML和XML文档的操作，在JavaScript中利用DOM操作HTML和CSS样式是最常用的样式之一。DOM对JavaScript是一种可操作HTML文档得重要手段。利用DOM可完成对HTML文档内所有元素的获取、访问、标签属...
HTML之Javascript——DOM文档对象模型
qq_45337431的博客
08-22 337
一、DOM概述 通过 HTML DOM,使用 JavaScript访问 HTML 文档的所有元素，完成相关的增删改查。 当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model）。 HTML DOM 模型被构造为对象的树 通过可编程的对象模型，JavaScript 获得了足够的能力来创建动态的 HTML。 JavaScript 能够改变页面中的所有 HTML ...
DOM-文档对象模型
zheng的博客
11-04 369
DOM的概念 文档对象模型（Document Object Model，简称DOM）。DOM是一种基于树的API文档，它要求在处理过程中整个文档都表示在存储器中。 DOM又称文档树模型 文档：一个网页可以称为文档 节点：网页中的所有内容都是节点（标签, 属性, 文本， 注释等） 元素：网页中的标签 属性：标签的属性 DOM经常进行的操作 获取元素 对元素进行操作（设置其属性或调用其方法） 动态创建元素 事件（什么时候做相应的操作） 获取页面元素 根据id获取元素 <scri
JavaScript之DOM文档对象模型--对HTML元素的访问操作
diakuicu0780的博客
08-10 712
1、DOM是文档对象模型（Document Object Model）的简称。 当网页加载时，可以将结构化文档在内存中转换成对象树。 简单的说，DOM并不是一种技术，而是一种访问结构化文档的思想。借助DOM模型，我们可以对DOM树进行修改、删除、新增等操作，让结构化文档动态化。 2、DOM模型中的节点--文档可以说是由节点构成的集合。在DOM模型中有以下3种节点： （1）元...
JavaScript（四）
qq_44012757的博客
09-09 170
For循环 <script type="text/javascript"> for(var i=1;i<=100;i++){ i+=i; } i=1; while(i<=100){ i+=i; i++; } alert(i); </script> 案例：用for循环求1~100的和 <script type="text/javascript"> //求1到100的和 var sum=
浅谈javascript六种数据类型以及特殊注意点
10-26
主要介绍了javascript六种数据类型以及特殊注意点，有需要的朋友可以参考一下
Javascript六种风格的时间显示方式
01-19
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
头歌教学实践平台 Web前端开发基础 JavaScript学习手册六：JS条件语句
最新发布
01-20
JavaScript是Web前端开发的核心语言之一，它为网页和应用程序提供了动态交互的能力。在JavaScript中，条件语句是控制程序流程的重要工具，它们允许我们根据不同的条件执行不同的代码块，从而实现逻辑判断和决策。本...
javascript
03-11
变量是存储值的容器，JavaScript支持六种原始数据类型：null、undefined、boolean、number、string和Symbol（ES6新增），以及一种复杂数据类型——object。控制结构包括条件语句（如if...else）和循环（如for、while...
DOM基础
m0_53644435的博客
12-01 609
一、初识Web API Web API是浏览器提供的一套操作浏览器功能和页面元素的接口。JavaScript语言由3部分组成，分别是ECMAScript、BOM和DOM，其中ECMAScript是JavaScript语言的核心，而Web API包括BOM和DOM两部分。 ...
DOM的简介、获取元素、事件基础、操作元素
GY的博客
06-07 557
DOM的简介、获取元素、事件基础、操作元素
Dom详细讲解
qq_51986661的博客
11-25 6723
文档对象模型，英文全称为Document Object Model，它提供了对文档的结构化的表述，并定义了一种方式可以使从程序中对该结构进行访问，从而改变文档的结构，样式和内容。D：Document，文档，表示的整个Html的网页文档O：Object, 对象，将网页的每一部分（标签）转换为每一个对象M：Model，模型，使用模型来表示对象之间的关系，方便我们获取。DOM 将文档解析为一个由节点和对象（包含属性和方法的对象）组成的结构集合。简言之，它会将web页面和脚本或程序语言连接起来，让脚本来操作页面，使
JavaScript中DOM简介、获取元素及事件基础
m0_52942098的博客
06-07 259
目录Web API简介与JavaScript的关系APIWeb APIDOM简介什么是DOMDOM树获取元素根据id获取元素根据标签名获取根据name获取元素HTML5新增的获取方式（根据选择器获取）document对象的属性（获取特殊元素）事件基础事件概述事件三要素执行事件的步骤常见的鼠标事件 Web API简介 与JavaScript的关系 API API（Application Programming Interface应用编程接口）是一些预先定义的函数，目的是提供应用程序与开发人员基于某软件或硬件
DOM（文档对象模型）
mengfanshaoxia的博客
02-15 2343
1、DOM是什么 DOM（Document Object Model，文档对象模型），是用来呈现以及与任意 HTML 或 XML文档 交互的API（Application Program Interface，应用程序接口）。DOM 是载入到浏览器中的文档 模型，以节点树的形式来表现文档，每个节点代表文档的构成部分（例如：页面元素、字符串或 注释等等）。 DOM 是万维网上使用最为广泛的 API 之一，它允许运行在浏览器中的代码访问文件中的节点并 与之交互。节点可以被创建，移动或修改
利用onlick设置背景颜色
Lnnmy的博客
11-27 284
利用onlick设置背景颜色 利用onlick设置背景颜色 提示：这里可以添加本文要记录的大概内容： 例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。 提示：以下是本篇文章正文内容，下面案例可供参考 二、使用 1.利用DOM可以完成对HTML文档内所有元素的获取、访问、标签属性和样式的设置等操作库 代码如下（示例）： div { width:100px; height:100px; background-colo
JavaScript——DOM（一）
zg0601的博客
11-29 945
本文介绍了JavaScript中DOM的基础知识——DOM简介、DOM树、节点基础及操作、事件基础、操作元素的内容。
DOM
忘川的博客
11-23 114
在介绍DOM之前，我们首先来看一下下面的例子： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>DOM第一次体验</title> </head> <body> <div></div...
javascript第六版电子书
07-03
JavaScript 第六版是一本关于 JavaScript 编程语言的电子书。JavaScript 是一种广泛应用于网页开发的脚本语言，它能够为网页添加交互、动态效果和实现各种功能。 该电子书是经过深入研究和编辑的权威指南，为了帮助...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值