孤猪的AJAX学习日记（持续更新）-优快云博客

本文链接：https://blog.youkuaiyun.com/snailjava/article/details/1337551

06 年 10 月 17 日

掌握 Ajax，第 1 部分: Ajax 简介

http://www-128.ibm.com/developerworks/cn/xml/wa-ajaxintro1.html

06 年 10 月 18 日

掌握 Ajax，第 2 部分: 使用 JavaScript 和 Ajax 发出异步请求

http://www-128.ibm.com/developerworks/cn/xml/wa-ajaxintro2/

摘录:

1 在上文中，开始接触最基本和基础性的有关 Ajax 的全部对象和编程方法：XMLHttpRequest 对象。

2 XMLHttpRequest 惟一的目的是让您发送请求和接收响应。其他一切都是 JavaScript、CSS 或页面中其他代码的工作：改变用户界面、切换图像、解释服务器返回的数据。准备好 XMLHttpRequest 之后，就可以向服务器发送请求了。

基于AJAX的应用

Google Maps 是另一种基于 Google 的 Web 2.0 应用程序。

Flickr 是一个很好的例子，说明如何使用 Ajax 创建类似桌面的 Web 应用程序。

Google GMail 是一个很好的例子，说明了基于 Ajax 的应用程序如何改变 Web 的工作方式。

掌握 Ajax，第 3 部分: Ajax 中的高级请求和响应

全面理解 HTTP 的状态代码、就绪状态和 XMLHttpRequest 对象

http://www-128.ibm.com/developerworks/cn/xml/wa-ajaxintro3/

掌握 Ajax，第 4 部分: 利用 DOM 进行 Web 响应

将 HTML 转换为对象模型

http://www-128.ibm.com/developerworks/cn/xml/wa-ajaxintro4/

摘录:

程序员（使用后端应用程序）和 Web 程序员（编写 HTML、CSS 和 JavaScript 上）之间的分水岭是长久存在的。但是，Document Object Model (DOM) 弥补了这个裂缝，使得在后端使用 XML 同时在前端使用 HML 切实可行，并成为极其有效的工具。在本文中，Brett McLaughlin 介绍了 Document Object Model，解释它在 Web 页面中的应用，并开始挖掘其在 JavaScript 中的用途。

掌握 Ajax，第 5 部分: 操纵 DOM

使用 JavaScript 即时更新 Web 页面

http://www-128.ibm.com/developerworks/cn/xml/wa-ajaxintro5/

摘录:

了解什么是 DOM 树，以及知道它如何表示 HTML 和 CSS 仅仅是控制 Web 页面的第一步。接下来还需要了解如何处理 Web 页面的 DOM 树。比方说，如果向 DOM 树中增加一个元素，这个元素就会立即出现在用户的 Web 浏览器中 —— 不需要重新加载页面。从 DOM 树中删除一些文本，那些文本就会从用户屏幕上消失。可以通过 DOM 修改用户界面或者与用户界面交互，这样就提供了很强的编程能力和灵活性。一旦学会了如何处理 DOM 树，您就向实现丰富的、交互式动态网站迈出了一大步。

上面五篇文章写的很好啊，但是对DOM不了解，现在去w3schools补补DOM的基础知识:

w3schools上面的HTML DOM介绍

什么是DOM?

What is the DOM?

"The W 3C Document Object Model (DOM) is a platform and language neutral interface that allows programs and scripts to dynamically access and update the content, structure, and style of a document."

The W 3C DOM provides a standard set of objects for representing HTML and XML documents, and a standard interface for accessing and manipulating them.

The DOM is separated into different parts (Core, XML, and HTML) and different levels (DOM Level 1/2/3 ):

Core DOM - defines a standard set of objects for any structured document
XML DOM - defines a standard set of objects for XML documents
HTML DOM - defines a standard set of objects for HTML documents

What is the HTML DOM?

The HTML DOM is the Document Object Model for HTML
The HTML DOM is platform and language independent
The HTML DOM defines a standard set of objects for HTML, and a standard way to access and manipulate HTML documents
The HTML DOM is a W 3C standard

The HTML DOM views HTML documents as a tree structure of elements embedded within other elements. All elements, their containing text and their attributes, can be accessed through the DOM tree. Their contents can be modified or deleted, and new elements can be created by the DOM. The elements, their text, and their attributes are all known as nodes.

按上面的定义，我的理解大概DOM的功能就是提供接口（给具体语言以特定的API）动态的更新文档的内容，结构，样式。这些文档可能是XML文档,HTML文档,上面的提到的Core DOM可能是一个通用的概念。指任何规范的文档都可以以DOM规定的某种形式映射成内存中的对象。提供一定的接口给具体的语言(java,c,javascript..)访问。

HTML页面　　-à　以DOM对象将元素映射到内存　-à 通过API访问改变内存中对象的值　--à　页面生效

上面还提到了分成三种级别(level)，不知道这级别是按照什么标准来区分的（通用—>特定？简单à复杂?）.

DOM应该是个很有用的东西，如果能动态的更新XML文档的内容，也就可以随时通过XML读取数据，这样不用经过数据库。这样可能快一点，而且也不用花钱买数据库。

能动态更新HTML的文档的样式的话。那网页能根据个人喜好设置风格，很不错。不知道CSS是不是就在通过DOM接口改变HTML的样式的？（未确认）

能动态更新HTML的结构的话，大多数blog的页面设置时的拖拉功能不知道是不是这样做的？

其它。。。

反正DOM是个很有用的技术。。。。。。。。。。。。。。。

继续学习。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。

再往下看

w3schools上面好象没什么了？只有HTML DOM 各种对象的例子和参考，要用的时候再来看吧。

就此打住，思考下，还有其他什么问题？

HTML DOM是怎么映射HTML中的各个东西的(如<a hfre=””>中的a和href)？

a 和 href相同对待吗？

通用节点类型

现在已经介绍了 DOM 节点的一些特性和属性（以及一些奇特的地方），下面开始讲述您将用到的一些特殊节点类型。多数 Web 应用程序中只用到四种节点类型：

文档节点表示整个 HTML 文档。
元素节点表示 HTML 元素，如 a 或 img。
属性节点表示 HTML 元素的属性，如 href（a 元素）或 src（img 元素）。
文本节点表示 HTML 文档中的文本，如 “Click on the link below for a complete set list”。这是出现在 p、a 或 h2 这些元素中的文字。