zoukankan      html  css  js  c++  java
  • 理解DOM

    DOM:面向对象的概念;

    将文档当成对象处理;

    以面向对象的方式来描述和操纵(树形结构)文档;

    什么是 HTML DOM?

    HTML DOM 是:

    • HTML 的标准对象模型
    • HTML 的标准编程接口
    • W3C 标准

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

    换言之,HTML DOM 是关于如何获取、修改、添加或删除 HTML 元素的标准。

    在网页上,组织页面(或文档)的对象被组织在一个树形结构中,用来表示文档中对象的标准模型就称为DOM。

    http://www.cnblogs.com/chaogex/p/3959723.html

    文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展标志语言的标准编程接口

    访问和修改文档信息的API规范。

    本文试图弄清楚DOM到底是什么,不会讨论具体DOM节点的操作。

    DOM是什么

    DOM全称为The Document Object Model,应该理解为是一个规范,定义了HTML和XML文档的逻辑结构和文档操作的编程接口。

    文档逻辑结构

    DOM实际上是以面向对象方式描述的对象模型,它将文档建模为一个个对象,以树状的结构组织(本文称之为“文档树”,树中的对象称为“节点”)。
    每个文档包含1个document节点,0个或1个doctype节点以及0个或多个元素节点等。document节点是文档树的根节点。
    如对于HTML文档,DOM 是这样规定的:

    • 整个文档是一个文档节点
    • 每个 HTML 标签是一个元素节点
    • 包含在 HTML 元素中的文本是文本节点
    • 每一个 HTML 属性是一个属性节点
    • 注释属于注释节点

    节点与文档内容是一一对应的关系,节点之间有层次关系。

    例如下面的hmlt文档:

    <!DOCTYPE html>
    <html>
    <head>
        <title>文档标题</title>
    </head>
    <body>
    <a href="">我的链接</a>
    <h1>我的标题</h1>
    </body>
    </html>

    会被建模为下面的文档树:

    又如下面的html文档:

    <!DOCTYPE html>
    <html class=e>
     <head><title>Aliens?</title></head>
     <body>Why yes.</body>
    </html>

    会被建模为下面的文档树:

    文档操作

    程序员可以使用DOM定义的接口来获得对文档中所有元素进行访问的入口,创建文档,浏览文档结构,添加、修改或删除文档元素和内容。
    HTML或XML文档中的所有的内容都可以通过使用DOM定义的接口来操作。

    DOM到底是对象模型还是编程接口?

    总的来说,DOM应该理解为是1个规范。
    站在实现(如浏览器)和使用者(如程序员)的角度来看,DOM就是一套文档节点的编程接口,只要实现了接口,就可以使用接口成员来操作文档;站在设计和制定的角度来看,DOM是一个对象模型,它将文档内容建模为对象并组织为树状结构,定义了这些对象的行为和属性以及这些对象之间的关系。

    DOM不是什么

    • DOM不是一个数据结构集,并没有定义数据结构。
    • DOM没有定义文档中什么信息是相关的或者文档中的信息是如何组织的。

    如对于XML,这些是在XML Information Set中指定的。DOM只是这些信息集的API。

  • 相关阅读:
    MVP模式与MVVM模式
    webpack的配置处理
    leetcode 287 Find the Duplicate Number
    leetcode 152 Maximum Product Subarray
    leetcode 76 Minimum Window Substring
    感知器算法初探
    leetcode 179 Largest Number
    leetcode 33 Search in Rotated Sorted Array
    leetcode 334 Increasing Triplet Subsequence
    朴素贝叶斯分类器初探
  • 原文地址:https://www.cnblogs.com/feng9exe/p/6125811.html
Copyright © 2011-2022 走看看