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

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

1.         Ajax全称Asynchronous JavaScript And Xml(异步JavaScriptXml

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

3.         Ajax 完全基于成熟的技术:1999XMLHttpRequest引入浏览器,成为事实上的标准;JavaScript DOM CSS则是W3C标准

4.         Ajax的典型应用是Google MapGoogle Suggest

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

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

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

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

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

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

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

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

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

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

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

XMLHttpRequest

1.         XMLHttpRequest对象由浏览器提供,由微软提出,由于并非标准,创建改对象因浏览器而异。IEnew 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方法创建请求:Openmethodurlasynchronoususerpassword
method
:请求类型 get post
asynchronous
bool型,是否使用异步
user password
可选参数

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

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 级联样式表 W3C标准定义:“一种对Web页面外观进行控制的机制“

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

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

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


XML JSON

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