DOM - 我们了解它了吗?

简介: ajax应用我们遇到的很多,但对于其中的DOM技术,是否了解了呢?看如下的资料:官网 http://www.w3.org/DOM/http://www.w3.org/DOM/Activity 实际的 DOM 推荐标准是一个 API,它定义了 XML 文档中出现的对象,以及用于访问和处理这些对象的方法和属性。

ajax应用我们遇到的很多,但对于其中的DOM技术,是否了解了呢?看如下的资料:

官网 http://www.w3.org/DOM/http://www.w3.org/DOM/Activity

实际的 DOM 推荐标准是一个 API,它定义了 XML 文档中出现的对象,以及用于访问和处理这些对象的方法和属性。 【The DOM is a set of web standards that describes how your script can interact with and access the structured document. DOM defines the objects, methods, and properties that are required to access, manipulate, and create the content, structure, style, and behavior in your documents.】

DOM是W3C(万维网联盟)标准。

DOM定义了一个标准用来访问像HTML和XML文档。

W3C文档对象模型(DOM)是一个平台和语言无关的接口,允许程序和脚本动态访问和更新文档的内容,结构和样式。

DOM 被分为3中不同的部分/级别:

Core DOM-定义了一套标准的针对任何结构化文档的对象

XML DOM-定义了一套标准的针对 XML 文档的对象

HTML DOM-定义了一套标准的针对 HTML 文档的对象

DOM定义了所有的文档元素的对象和属性,以及访问它们的方法(接口)

从 DOM Level 1 开始,DOM API 包含了一些接口,用于表示可从 XML 文档中找到的所有不同类型的信息。它还包含使用这些对象所必需的方法和属性。

Level 1 包括对 XML 1.0 和 HTML 的支持,每个 HTML 元素被表示为一个接口。它包括用于添加、编辑、移动和读取节点中包含的信息的方法,等等。然而,它没有包括对 XML 名称空间(XML Namespace)的支持,XML 名称空间提供分割文档中的信息的能力。

DOM Level 2 添加了名称空间支持。Level 2 扩展了 Level 1,允许开发人员检测和使用可能适用于某个节点的名称空间信息。Level 2 还增加了几个新的模块,以支持级联样式表、事件和增强的树操作。

DOM Level 3 包括对创建 Document 对象的更好支持、增强的名称空间支持,以及用来处理文档加载和保存、验证以及 XPath 的新模块;XPath 是在 XSL 转换(XSL Transformation)以及其他 XML 技术中用来选择节点的手段。

DHTML

“Dynamic HTML is a term used by some vendors to describe the combination of HTML, style sheets, and scripts that allows documents to be animated” (http://www.w3.org/DOM/#why).

The ideas behind DOM do incorporate DHTML concepts, but DHTML includes nonstandard

objects, such as document.all, that vary from browser to browser. Yes, that’s right;  document.all as well as many other collections are not actually part of W3C standards or recommendations.

DOM Level 0

DOM 最初被当作 Web 浏览器识别和处理页面元素的方式 ―― 即在 W3C 介入之前的功能,称为 “DOM Level 0”。 【There is no DOM Level 0, so don’t go looking for Level 0 specifications. If someone is referring to “Level 0,” they’re most likely referring to a set of proprietary DHTML methods, objects, and collec-tions. These were implemented in different ways across the various browsers before there was a stan-dard specification.】

DOM Level 1

The Level 1 DOM ( http://www.w3.org/DOM/DOMTR#dom1) is the first version of the DOM standard pub-lished as a recommendation way back in October of 1998. It’s a single specification comprised of two main parts:

Ø DOM Core : Gives you the inner workings of the generic tree node structure for XML documents along with the properties and methods required to create, edit, and manipulate the tree.

Ø DOM HTML: Gives you the objects, properties, and methods for the specific elements associ-ated with HTML documents, collections of tags, and each of the individual HTML tags

The Level 1 specification includes object definitions such as Document, Node, Attr, Element, Text, HTMLDocument, HTMLElement, and  HTMLCollection.

DOM Level 2

The Level 2 DOM ( http://www.w3.org/DOM/DOMTR#dom2), published in November of 2000, updates the Core (DOM2 Core) and adds several other specifications. The DOM2 HTML specification was pub-lished in January of 2003 and added additional objects, properties, and methods specific to HTML 4.01 and XHTML 1.0. The DOM 2 recommendations are split into six different specifications:

Ø DOM2 Core: Like DOM Core, this gives you control of the structure of the DOM document but adds additional features, such as namespace-specific methods that you can see in the changes Appendix at http://www.w3.org/TR/2000/REC-DOM-Level-2-Core-20001113/changes.html.

Ø DOM2 HTML: Like DOM HTML, this gives you control of HTML-specific DOM documents but includes a few additional properties as noted in the changes Appendix at  http://www.w3.org/TR/2003/REC-DOM-Level-2-HTML-20030109/changes.html.

Ø DOM2 Events : This gives you control of mouse-related events including targeting, capturing, bubbling, and canceling but doesn’t contain handles for keyboard-related events.

Ø DOM2 Style: Alternatively known as DOM2 CSS, this gives you the ability to access and manip-ulate all your CSS-related styling and rules.

Ø DOM2 Traversal and Range : These give you iterative access to the DOM, so you can walk and manipulate the document as needed.

Ø DOM2 Views: This gives you the ability to access and update a representation of a document.

DOM Level 3

http://www.w3.org/2004/03/dom-level-3-pr.html.en

http://www.w3.org/DOM/DOMTR#dom3

Ø DOM3 Core: Adds more new methods and properties to the Core as well as changing a few existing methods as outlined in the changes Appendix at  http://www.w3.org/TR/2004/REC-DOM-Level-3-Core-20040407/changes.html

Ø DOM3 Load and Save: Gives you the ability to load the content of an XML document into your DOM document and serialize your DOM document into an XML document

Ø DOM3 Validation: Allows you to ensure your dynamic document is valid and conforms to the doctype

Ø DOM3 Events : Will give access to keyboard- and mouse-related events

Ø DOM3 XPath: Will give access to the DOM document’s tree structure using XPath 1.0 queries (http://www.w3.org/TR/xpath)

Ø DOM3 Views and Formatting and DOM3 Abstract Schemas: Will allow you to  dynamically access and update the content, structure, and style of documents

DOM Level 4

草案中

DOM HTML

HTML DOM 定义了访问和操作HTML文档的标准方法。

The DOM2 HTML specification is rather lengthy, as it contains a specific object for every HTML element. 

Remember that the original DOM2 Core objects still apply, as each of the DOM2 HTML objects

extends from the Core object.

DOM 2 Core API接口选

interface Document : Node {

  readonly attribute DocumentType     doctype;

  readonly attribute DOMImplementation  implementation;

  readonly attribute Element          documentElement;

  Element            createElement(in DOMString tagName)

                                        raises(DOMException);

  DocumentFragment   createDocumentFragment();

  Text               createTextNode(in DOMString data);

  Comment            createComment(in DOMString data);

  CDATASection       createCDATASection(in DOMString data)

                                        raises(DOMException);

  ProcessingInstruction createProcessingInstruction(in DOMString target,

                                                    in DOMString data)

                                        raises(DOMException);

  Attr               createAttribute(in DOMString name)

                                        raises(DOMException);

  EntityReference    createEntityReference(in DOMString name)

                                        raises(DOMException);

  NodeList           getElementsByTagName(in DOMString tagname);

  // Introduced in DOM Level 2:

  Node               importNode(in Node importedNode,

                                in boolean deep)

                                        raises(DOMException);

  // Introduced in DOM Level 2:

  Element            createElementNS(in DOMString namespaceURI,

                                     in DOMString qualifiedName)

                                        raises(DOMException);

  // Introduced in DOM Level 2:

  Attr               createAttributeNS(in DOMString namespaceURI,

                                       in DOMString qualifiedName)

                                        raises(DOMException);

  // Introduced in DOM Level 2:

  NodeList           getElementsByTagNameNS(in DOMString namespaceURI,

                                            in DOMString localName);

  // Introduced in DOM Level 2:

  Element            getElementById(in DOMString elementId);

};

如上可见,我们常用的接口都在上面了。

各浏览器的支持情况

http://www.quirksmode.org/dom/w3c_core.html

 

参考图书 

JavaScript DOM编程艺术(第2版) http://book.360buy.com/10603153.html 

相关文章
|
7天前
|
存储 关系型数据库 分布式数据库
PostgreSQL 18 发布,快来 PolarDB 尝鲜!
PostgreSQL 18 发布,PolarDB for PostgreSQL 全面兼容。新版本支持异步I/O、UUIDv7、虚拟生成列、逻辑复制增强及OAuth认证,显著提升性能与安全。PolarDB-PG 18 支持存算分离架构,融合海量弹性存储与极致计算性能,搭配丰富插件生态,为企业提供高效、稳定、灵活的云数据库解决方案,助力企业数字化转型如虎添翼!
|
6天前
|
存储 人工智能 Java
AI 超级智能体全栈项目阶段二:Prompt 优化技巧与学术分析 AI 应用开发实现上下文联系多轮对话
本文讲解 Prompt 基本概念与 10 个优化技巧,结合学术分析 AI 应用的需求分析、设计方案,介绍 Spring AI 中 ChatClient 及 Advisors 的使用。
328 130
AI 超级智能体全栈项目阶段二:Prompt 优化技巧与学术分析 AI 应用开发实现上下文联系多轮对话
|
18天前
|
弹性计算 关系型数据库 微服务
基于 Docker 与 Kubernetes(K3s)的微服务:阿里云生产环境扩容实践
在微服务架构中,如何实现“稳定扩容”与“成本可控”是企业面临的核心挑战。本文结合 Python FastAPI 微服务实战,详解如何基于阿里云基础设施,利用 Docker 封装服务、K3s 实现容器编排,构建生产级微服务架构。内容涵盖容器构建、集群部署、自动扩缩容、可观测性等关键环节,适配阿里云资源特性与服务生态,助力企业打造低成本、高可靠、易扩展的微服务解决方案。
1331 8
|
5天前
|
监控 JavaScript Java
基于大模型技术的反欺诈知识问答系统
随着互联网与金融科技发展,网络欺诈频发,构建高效反欺诈平台成为迫切需求。本文基于Java、Vue.js、Spring Boot与MySQL技术,设计实现集欺诈识别、宣传教育、用户互动于一体的反欺诈系统,提升公众防范意识,助力企业合规与用户权益保护。
|
17天前
|
机器学习/深度学习 人工智能 前端开发
通义DeepResearch全面开源!同步分享可落地的高阶Agent构建方法论
通义研究团队开源发布通义 DeepResearch —— 首个在性能上可与 OpenAI DeepResearch 相媲美、并在多项权威基准测试中取得领先表现的全开源 Web Agent。
1412 87
|
6天前
|
人工智能 Java API
AI 超级智能体全栈项目阶段一:AI大模型概述、选型、项目初始化以及基于阿里云灵积模型 Qwen-Plus实现模型接入四种方式(SDK/HTTP/SpringAI/langchain4j)
本文介绍AI大模型的核心概念、分类及开发者学习路径,重点讲解如何选择与接入大模型。项目基于Spring Boot,使用阿里云灵积模型(Qwen-Plus),对比SDK、HTTP、Spring AI和LangChain4j四种接入方式,助力开发者高效构建AI应用。
315 122
AI 超级智能体全栈项目阶段一:AI大模型概述、选型、项目初始化以及基于阿里云灵积模型 Qwen-Plus实现模型接入四种方式(SDK/HTTP/SpringAI/langchain4j)
|
5天前
|
JavaScript Java 大数据
基于JavaWeb的销售管理系统设计系统
本系统基于Java、MySQL、Spring Boot与Vue.js技术,构建高效、可扩展的销售管理平台,实现客户、订单、数据可视化等全流程自动化管理,提升企业运营效率与决策能力。
|
7天前
|
弹性计算 安全 数据安全/隐私保护
2025年阿里云域名备案流程(新手图文详细流程)
本文图文详解阿里云账号注册、服务器租赁、域名购买及备案全流程,涵盖企业实名认证、信息模板创建、域名备案提交与管局审核等关键步骤,助您快速完成网站上线前的准备工作。
256 82
2025年阿里云域名备案流程(新手图文详细流程)