[本周]----我们共同关注：Ajax 那点事

上周的话题是页面转向，帖子很热，大家都给出了自己的方法。我本来认为自己总结的很全，看到回帖才直到有些几乎没有怎么用过的方法，收获不小。[本周]话题：Ajax那点事

这个话题很大，首先想到的是一大堆.net下的Ajax开发框架，想到曾经的Atlas，想到一大堆借Ajax春风火了一把的图书。我们今天要把问题简化一下，逐条列出Ajax不得不说的那点事。我做好接砖的准备了，来吧… …

1. Ajax全称Asynchronous JavaScript And Xml（异步JavaScript和Xml）

2. Ajax是2005年2月Adaptive Path公司的Jesse James Garrett在文章”Ajax:A New Approach To Web Applications”提出。

3. Ajax 完全基于成熟的技术：1999年XMLHttpRequest引入浏览器，成为事实上的标准；JavaScript DOM CSS则是W<?xml:namespace prefix = st1 ns = "urn:schemas-microsoft-com:office:smarttags" /><chmetcnv unitname="C" sourcevalue="3" hasspace="False" negative="False" numbertype="1" tcsc="0" w:st="on">3C</chmetcnv>标准

4. Ajax的典型应用是Google Map和Google Suggest

5. 传统的Web开发模式是：请求—>刷新—>响应 每一个页面对应服务器端的业务逻辑，客户端的页面实际上是纯界面性质的

6. Ajax同步的模式转为异步，引用时服务器端的页面不再只是界面表现的工具，而可以成为数据提供的接口。

7. JavaScript在Web开发的角色发生改变，不再只是与花哨的页面特效，一下子从后台走向前台。成为Ajax各种技术的桥梁！

8. XMLHttpReques对象异步的提交信息，Ajax的核心动力！

9. Xml为跨平台 跨领域的通信提供了通信载体，它简洁 通用 规范

10. DOM文档对象模型，用来表示浏览器上的整个文档对象及其层次结构。DOM中的所有节点可以使用JavaScript脚本使用。

11. DOM模型使得页面层次结构能够动态的变化。

12. 不得不说：CSS使Ajax对页面展现的控制更加灵活 方便 高效；CSS使外观独立于HTML容器而存在

13. 我们通过一个例子做一个整体上的梳理：JavaScript使用XMLHttpRequest从服务器端获取所需要的信息，数据传递是XML格式的，通过DOM和CSS结合可以实现局部的刷新

JavsScript
对于JavaScript，我们要做更多的是一个学习重点的改变和态度的扭转。
不只是玩几个特效，JavaScript有很多东西一直被我们忽略着。看看开源JS框架ProtoType的代码，知道竟然可以把Js写到这种程度。具体JavaScript细节不再展开;
Prototype资料：

送给所有关注Prototype的朋友们 【完整版】Prototype实战教程 1-16

XMLHttpRequest<?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" />

1. XMLHttpRequest对象由浏览器提供，由微软提出，由于并非标准，创建改对象因浏览器而异。IE：new AcitveXObject(‘Microsoft. XMLHttp’) Mozilla: new XMLHttpRequest()

2. readystate 表示XMLHTTP的请求状态
0-已创建但尚未初始化，未调用open方法
1---Open方法已调用但未调用Send方法
2---Send方法已调用，其它数据未知
3---请求已经发送成功，正在接受数据
4---数据接受成功 浏览器状态栏显示”完成”

3. status属性存储服务器端返回的HTTP响应代码，用来判断请求的结果
200:成功 202：请求被接受，但是未处理 400：错误的请求 404：请求资源未找到
500：内部服务器错误

4. Open方法创建请求：Open（method，url，asynchronous，user，password）
method：请求类型 get 或post
asynchronous：bool型，是否使用异步
user password 可选参数

5. 创建了请求之后使用Send方法来向服务器发送请求：send（body）body的格式为查询字符串格式。如果是异步提交请求则执行之后立即执行下一条语句，否则一致阻塞直到返回

6. 如果open指定了Post方式提交那么要设置HTTP头：
xmlHttp.setRequestHeader(“content-Type”,”application/x-www-form-urlencoded”)

7. 在open send方法之前定义onreadystatechange事件来捕获请求的状态变化

8. responseText获得返回的文本

9. reponseXml用来获得返回的XML

10. abort方法取消一个请求

DOM

1. DHTML发展而来

2. DOM侧重于模型而非结构，作为一个对象模型，定义了每个对象的接口

3. DOM包含：最底层的文档操作接口 HTML XML

4. 动态的创建、改变、clone节点等等都是相关知识点 不再详述

CSS

1. Cascading Style sheet 级联样式表 W<chmetcnv unitname="C" sourcevalue="3" hasspace="False" negative="False" numbertype="1" tcsc="0" w:st="on">3C</chmetcnv>标准定义：“一种对Web页面外观进行控制的机制“

2. 用来取代传统的HTML表现代码，样式独立于页面

3. 样式文件 缓存浏览器中 节省了带宽

4. 更丰富的页面效果，据我们的美工说还可以使用滤镜等等 非专业人士不复多

XML JSON

XML JSON作为数据通信的载体出现，就XML就有N本砖头一样的专著，点到即止，不再展开