Ajax实现原理
当下盛行的Ajax
现在Ajax框架数不胜数,Ajax的功能也太庞大的以至于它连它的父辈Javascript都带动起来了,记得我最初接触web的时候Javascript还没到达有现在的高度,如今随着客户提醒越来越重要,很多软件开发并不仅仅停留在功能实现的要求上,而是更注重交互、分享和互动(这也是web2.0的目标)。其实这也是完全正确的,毕竟那种仅仅赋予功能的东西我们不能满足了,例如你买东西还想要挑好看的呢,何况软件开发呢。回到正题,Ajax框架我还是赞成使用的,毕竟自己来实现效率太慢了,像目前优秀的javascript框架jQuery就不得不令人赞赏,而且它也是越来越受欢迎,连微软都在Asp.Net MVC框架中自带了jQuery。但是我觉还是有必要了解Ajax的本质的,这样你才能运用自如。
Ajax
的工作
Ajax直觉认识:我们发送一个请求,但是这个请求比较特殊它是异步的,也就是说客户端是不会感觉到的。在发送这个请求的时候我们绑定了一个事件,这个事件会监控我们发送请求的状态,并且每次状态改变都会触发,所以我们就可以根据不同的状态让他执行不同的操作。请求到达服务器端的后服务器端根据相应的请求返回对应的信息,这个返回信息我们可以取得并且是异步得到,不会引起客户端刷新。既然在上面已经绑定了监控状态变化的事件,我们就可以在那里首先做好在得到返回信息要做的处理(当然如果失败也会有相应的状态我们也会做出相应的处理),我们在处理中得到返回信息通过javascript在客户端做相应操作即可。
Ajax
核心—XMLHttpRequest
上面我们大概感受了一下Ajax的过程,我们发现发送异步请求才是核心,事实上它就是XMLHttpRequest,整个Ajax之所以能完成异步请求完全是因为这个对应可以发送异步请求的缘故。而且我们又发现上面那个事件就是整个处理过程的核心,可以根据不同状态执行不同操作,其实它就是XMLHttpRequest的方法onreadystatechange,它在每次状态发生改变时都会触发。那么是谁取得的返回信息呢?它就是XMLHttpRequest的另一个方法responseText(当然还有responseXML)。(⊙o⊙)哦,我们还没有说发送给谁以及执行发送操作,这两个就是XMLHttpRequest的open和send方法。Y(^o^)Y,其他的当然还有了,我们直接列出来吧:
XMLHttpRequest
对象
属性
readyState
请求状态,开始请求时值为0直到请求完成这个
相关文档:
打开请求
有了要连接的 URL 后就可以配置请求了。可以用 XMLHttpRequest 对象的 open() 方法来完成。该方法有五个参数:
request-type:发送请求的类型。典型的值是 GET 或 POST,但也可以发送 HEAD 请求。
url:要连接的 URL。
asynch:如果希望使用异步连接则为 true,否则为 false。该参数是可选的,默认为 true。
......
用过Wordpress的朋友都知道,因为Wordpress的开放性,可以装很多插件,并且
各种主题也是良莠不齐,很多做主题的人本身可能是设计人员,对于SEO和速度考虑本身不太多,所以造成Wordpress非常庞大,有时候首页要到
500k至1M这样的水平。根据现在国内网速,一般都是以512k或者1M,那么以首页500K来看,全速下载需要10秒左 ......
AJAX是Asynchronous JavaScript and XML缩写。这个概念代表的是一种技术,当您在说“我在项目中使用了AJAX技术时”,只是代表了您使用客户端XMLHttpRequest对象与服务器端进行异步通信。不过因为随着AJAX技术的运用往往会带来丰富的客户端效果,因此对AJAX技术的广义理解也可以认为这是一种操作 ......
把自己写的jquery写下来
比如现在有一个界面,分左右两侧,当点击左侧的标签,然后在右侧框显示,实现无刷新技术,这是最简单的ajax应用
function touser() {
$.ajax({
url: "UserTable.aspx?timeStamp=" + new Date().getTime(),
success: function(msg) {
$("#ma ......
简单的Ext.Ajax. request示例
var requestConfig = {
url :'loginServer.jsp',//请求的服务器地址
params : {userName : 'tom',password : '123'},//请求参数 ......