AJax学习

原创 2006年06月10日 22:29:00

1一些概念:

DHTML,XML,XML衍生语言(XUL,XAML,XAMJ.MXML),Javascript,CSS,XMLHttpRequest,DOM,JSON

AJax 的应用:google maps,google mail,google suggest,amazon的搜索工具,

2AJax的第一篇文章:

Jesse James Garrett of Adaptive Path:AJax:A new approach to web applications

http://adaptivepath.com/publications/essays/archives/000385.php

http://www.javalobby.org/articles/ajax/

3一些关键理念

以前的web是基于请求/响应模式的,对于每个请求都会重新加载整个页面,原来的页面被放到浏览器的历史栈中。

AJax使这种模式发生改变,这是AJax的核心所在。

AJax可以自由地与服务器进行异步的交互。虽然以前也能异步交互,但是称不上自由。

AJax最初是Asynchronous Javascript + XML,现在这个词被扩展了:所有允许浏览器与服务器通信而无需刷新当前页面的技术。

4AJax的典型使用(用javascript实现):

a。新建XHR对象

function createXMLHttpRequest()

{

if (window.ActiveXObject)//IE

{

xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

}

else if (window.XMLHttpRequestI)

{

xmlHttp = new XMLHttpRequest();

}

}

b。指定XHR.onreadystatechange对应的函数,onreadystatechange其实是一个事件处理器,在XHR状态变化时被调用。通常用来捕捉请求,响应的状态。

通常在一个函数中做出定义,该函数在向服务器请求服务时被调用。

同时指定请求的方法,及请求资源的URL等

function startRequest()

{

createXMLHttpRequest();

xmlHttp.onreadystatechange= handleStateChange;

xmlHttp.open("GET","innerHTML.xml",true);

xmlHttp.send(null);//.发出请求

}

c。定义onreadystatechange对应的处理函数。

function handleStateChange()

{

...

}

d。在html中相应的位置,指定对服务器的请求。

<input type="button" onclick="startRequest();" />

5DOM的使用

服务器对请求的响应,可能以文本的方式,或xml的方式,发送回来。

在handleStateChange()中分别用xmlHttp.responseText,xmlHttp.responseXML来捕捉。

后者返回一个DOM对象。

DOM是与平台和语言无关的接口,允许程序和脚本动态地访问和更新文档的内容、结构、样式。文档可以进一步处理,处理结果可以放回到所提供的页面中。

DOM面向的文档是html,xml。

javascript中将web页面视为一系列元素按一定结构构成的,可以用一个DOM来访问。

6发送请求参数

上面的例子中,send(null)这个发送请求的函数没有参数,

现在要发送请求参数。另外,请求发送有两种方式,get,post。

不改变数据模型状态,用get,否则用post。

两者第二个区别:get将请求以字符串的形式附在URL中发送,

post将请求以请求体的方式发送。

请求参数:content

send(content),content可以是DOM,输入流,串,xml等。

xml可以发送复杂的参数,但是xml本身比较复杂,有一个解决方案用JSON来发送参数。JSON是一种轻量级数据交换方式,是文本方式的,提供了多种语言的支持。如java,javascript,详见www.json.org

版权声明:本文为博主原创文章,未经博主允许不得转载。

Ajax深入学习笔记

最近在学习ajax,下面整理了一下学习的内容,以便巩固用。 先来看看为什么要用ajax,也就是同步和异步是什么:同步和异步同步的意思就是客户端提交表单,发起请求后需要一直等待服务器端的响应,收到服务...
  • VivianHope
  • VivianHope
  • 2015年06月03日 15:54
  • 1804

Ajax学习总结(一)

Ajax学习(一) 一、      什么是ajax 1、Ajax(Asynchronous JavaScript and XML)使用脚本操纵HTTP的Web应用架构。 2、所有的浏览器都支持X...
  • u010913443
  • u010913443
  • 2016年08月13日 17:31
  • 1045

AJAX学习-到底是个什么东西

AJAX 是将咱们之前学到的HTML、CSS、XML、Js等web知识结合起来使用的一门技术,通过XMLHttpRequest对象实现异步的操作,可以在不重新加载整个页面的情况下,与服务器交换数据并更...
  • u010168160
  • u010168160
  • 2015年01月05日 07:55
  • 5222

AJAX学习总结(入门)

AJAX教程:http://www.w3school.com.cn/ajax/index.asp AJAX视频教程:http://www.imooc.com/view/250...
  • doris_d
  • doris_d
  • 2015年03月03日 09:57
  • 976

【Ajax】——学习后的小结

背景:牛腩中接触过CSS,当时对这个CSS情有独钟,因为它可以美化界面,而我就喜欢和界面这种看得见效果的东西打交道,现在又重新学习,而且内容还那么多,超级开心,废话少说,动手吧! 一、CSS滤镜 ...
  • u013043341
  • u013043341
  • 2016年01月15日 21:46
  • 922

AJAX学习必备三本书

AJAX学习必备三本书 【http://club.book.csdn.net/people/mylist599.html】Ajax基础教程(亚马逊计算机榜首图书,国内第1本Ajax图书)   (美)阿...
  • phdbrianlee
  • phdbrianlee
  • 2007年09月19日 17:41
  • 2510

Ajax系统学习总结

Ajax的工作原理相当于在用户和服务器之间加上了一个中间层,是用户操作与服务器响应异步化。Ajax的一个最大的特点是无需刷新页面,便可向服务器传输或读写数据(又称无刷新更新页面),这一特点主要得益于X...
  • lmb55
  • lmb55
  • 2016年05月26日 19:58
  • 862

js的Ajax学习

Ajax:异步的javascript和xml Ajax 的核心是XMLHttpRequest对象,该对象为向服务器发送请求和解析服务器响应提供了流畅的接口。能够以异步方式从服务器取得更多信息,用户不需...
  • liujie19901217
  • liujie19901217
  • 2016年03月02日 21:06
  • 1155

Ajax很简单

 最初看到ajax感觉好惊喜啊,不用刷新全部页面,就可以更改局部页面数据。真的很方法但是以为会很难,但实际做了才知道,AJAX很简单。至少入门很简单 如果你会ajax那就不要看了。更不要骂我。比我牛的...
  • kingbug
  • kingbug
  • 2005年10月06日 16:02
  • 1335

ajax的总结和使用

Ajax 完整教程 Ajax 由 HTML、JavaScript™ 技术、DHTML 和 DOM 组成,这一杰出的方法可以将笨拙的 Web 界面转化成交互性的 Ajax 应用程序。本文的作者是一位 ...
  • qq_34664963
  • qq_34664963
  • 2016年12月26日 14:57
  • 485
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:AJax学习
举报原因:
原因补充:

(最多只允许输入30个字)