一、什么是DOM

DOM 是 Document Object Model(文档对象模型)的缩写。
DOM 是 W3C(万维网联盟)的标准。
DOM 定义了访问 HTML 和 XML 文档的标准:
“W3C 文档对象模型 (DOM) 是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容、结构和样式。”

W3C DOM 标准被分为 3 个不同的部分:

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

二、HTML DOM (文档对象模型)

当网页被加载时,浏览器会创建页面的文档对象模型(DOM)。
通过 HTML DOM,可访问 JavaScript HTML 文档的所有元素。
HTML DOM 定义了所有 HTML 元素的对象和属性,以及访问它们的方法。

三、DOM 节点

根据 W3C 的 HTML DOM 标准,HTML 文档中的所有内容都是节点:
  • 整个文档是一个文档节点
  • 每个 HTML 元素是元素节点
  • 每个 HTML 属性是属性节点
  • HTML 元素内的文本是文本节点
  • 注释是注释节点
HTML DOM 将 HTML 文档视作树结构。这种结构被称为节点树:

四、编程接口

可通过 JavaScript (以及其他编程语言)对 HTML DOM 进行访问。
所有 HTML 元素被定义为对象,而编程接口则是对象方法和对象属性。
方法是您能够执行的动作(比如添加或修改元素)。
属性是您能够获取或设置的值(比如节点的名称或内容)。
 
 

JavaScript(三、DOM文档对象模型)的更多相关文章

  1. javascript之DOM文档对象模型编程的引入

    /* DOM(Document Object Model) 文档对象模型 一个html页面被浏览器加载的时候,浏览器就会对整个html页面上的所有标签都会创建一个对应的 对象进行描述,我们在浏览器上看 ...

  2. JavaScript笔记03——文档对象模型(Document Object Model,简称DOM):获取HTML元素、操作HTML元素

    Dom技术使得用户页面可以动态地变化,如可以动态地显示或隐藏一个元素,改变它们的属性,增加一个元素等,Dom技术使得页面的交互性大大地增强.[1] DOM实际上是以面向对象方式描述的文档模型.DOM定 ...

  3. html--JavaScript之DOM (文档对象模型)

    一.简介 当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model). HTML DOM 定义了用于 HTML 的一系列标准的对象,以及访问和处理 HTML 文档的标 ...

  4. DOM文档对象模型简介

    DOM简介     DOM是W3C(万维网联盟)的标准 "W3C文档对象模型DOM是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容.结构.样式".W3C DOM ...

  5. JavaScript学习(6)-文档对象模型基础

    JavaScript学习6-文档对象模型基础 1.节点方法 节点对象方法(W3C DOM Level2) 方法 说明 appendChild(newChild) 添加子节点到当前节点的末端 clone ...

  6. dom文档对象模型图

  7. JavaScript交互式网页设计 • 【第4章 JavaScript文档对象模型】

    全部章节   >>>> 本章目录 4.1 文档对象模型简介及属性 4.1.1 文档对象模型概述 4.1.3 实践练习 4.2 document 对象查找 HTML 元素 4.2 ...

  8. 文档对象模型 DOM

    1 DOM概述 1.1 什么是DOM 文档对象模型 Document Object Model 文档对象模型 是表示和操作 HTML和XML文档内容的基础API 文档对象模型,是W3C组织推荐的处理可 ...

  9. Javascript学习笔记2.1 Javascript与DOM简介

    DOM(文档对象模型)简介 DOM(文档对象模型)针对HTML和XML文档的一个API. DOM可以将任何HTML或XML文档描绘成由多层节点构成的树形结构,它是中立于平台和语言的接口,允许程序和脚本 ...

随机推荐

  1. 《java入门第一季》之Calendar类小案例获取任意二月天数

    import java.util.Calendar; import java.util.Scanner; /* * 获取任意一年的二月有多少天 * * 分析: * A:键盘录入任意的年份 * B:设置 ...

  2. Mahout系列之-----相似度

    Mahout推荐系统中有许多相似度实现,这些组件实现了计算不能User之间或Item之间的相似度.对于数据量以及数据类型不同的数据源,需要不同的相似度计算方法来提高推荐性能,在mahout提供了大量用 ...

  3. OpenCV 轮廓检测

    使用OpenCV可以对图像的轮廓进行检测.这是之前用过的代码,挺简单的,回顾一下.主要要进行以下2步操作: 1.cvThreshold():对图像进行二值化处理 2.cvFindContours(): ...

  4. Mahout Bayes分类

    Mahout Bayes分类器是按照<Tackling the Poor Assumptions of Naive Bayes Text Classiers>论文写出来了,具体查看论文 实 ...

  5. C语言之选择排序

    选择法排序是相对好理解的排序算法.假设要对含有n个数的序列进行升序排列,算法步骤是: 1.从数组存放的n个数中找出最小数的下标(算法见下面的"求最值"),然后将最小数与第1个数交换 ...

  6. PyCharm命令行输入

    PyCharm命令行输入 写作原因 网上资料比较杂,版本较老,与现在的版本有区别,所以根据网上资料和自己亲手实验撰写此文. 设置方法 在菜单中按此路径设置: Run->Edit Configur ...

  7. iOS使用第三方管理工具

    1.安装cocoaPods 移除当前镜像,因为需要FQ跨域访问 001.gem source --remove https://rubygems.org/ 使用淘宝镜像安装 002.https://r ...

  8. ionic1 下拉刷新 上拉加载 功能

    html页面如下 <ion-content> <ion-refresher pulling-text="刷新" on-refresh="search() ...

  9. xml与object 之间的ORM

    xml映射为object对象,同时object对象,以xml来表示: public class Tools { private static XmlNodeList SelectNodes(strin ...

  10. react中需要用到【深度复制】的问题

    首先,说一下我所遇到的问题,我所做的项目是用的基于react的antd框架. 一张表格,里面的数据是从后台获取直接渲染,我点击修改按钮,在modal弹框中修改数据,但是没有点击确定,点击取消,发现页面 ...