JavaScript FAQ(九)——Ajax

简介:  七、Ajax问题 1. Ajax:异步JavaScript和XML(Ajax: Asynchronous JavaScript and XML)Q:Ajax这个流行词到底是什么意思呀?A:Ajax这个短语最初有Jesse James Garrett提出,他是Adaptive Path的共同创始人。

 七、Ajax问题

 

1. Ajax:异步JavaScript和XML(Ajax: Asynchronous JavaScript and XML

Q:Ajax这个流行词到底是什么意思呀?

A:Ajax这个短语最初有Jesse James Garrett提出,他是Adaptive Path的共同创始人。缩略语Ajax(通常只有第一个字母A大写)代表异步JavaScript和XML(Asynchronous JavaScript and XML);从本质上说,它是一个营销短语,意思是可以开发一种新的Web应用程序的一套技术。

一个基于Ajax的Web应用程序,不同于传统的网站:

  • 功能不需要重新加载网页就可以管理客户端电脑上的应用程序;
  • 广泛使用的文档对象模型( DOM )和JavaScript来执行的交互性的应用;
  • 依赖XMLHttpRequest调用(或相似技术)与Web服务器交换信息;
  • 在后台异步执行客户端服务器之间的数据交换,而同时用户还可以在浏览器中继续和Web应用程序进行交互。

Paul Graham在他的文章Web 2.0中给出了基于Ajax的Web应用程序的以下特征:

从根本上说,“Ajax”意味着“JavaScript发挥作用。”这又意味着,基于web的应用程序现在可以做的更像桌面程序。当你读到这篇文章时,全新一代利用Ajax优点的软件正在编写中。这是自微机出现以来一波新的应用程序。

 

2. XMLHttpRequest

Q:我如何从服务器请求数据而又不用重载页面呢?

A:已加载到客户端浏览器中的JavaScript代码可以通过XMLHttpRequest对象从Web服务器请求其他数据。试一下:

在这个例子中,当你点击“Send Request”按钮时,浏览器就会向服务器请求额外的数据(文件requested_file.html),然后执行以下代码在消息框中显示返回的数据:

var oRequest = new XMLHttpRequest();
var sURL  = "http://"+self.location.hostname+"/faq/requested_file.htm";
oRequest.open("GET",sURL,false);
oRequest.setRequestHeader("User-Agent",navigator.userAgent);
oRequest.send(null)
if (oRequest.status==200) alert(oRequest.responseText);
else alert("Error executing XMLHttpRequest call!");

在大多数当今的浏览器中,XMLHttpRequest.open()的一般语法如下:

 

var oRequest = new XMLHttpRequest();
oRequest.open( method, URL, async )

参数method、URLasync的意思分别为:

 

method  指定HTTP请求使用的方法,可能是下列之一:“GET”、“POST”,“HEAD”。

URL  指定当XMLHttpRequest.send()执行时请求被发送的URL。

async  Boolean。如果是true,说明HTTP应该异步执行,也就是,不会强制代码,直到请求结果返回到浏览器。

注意,XMLHttpRequest.open()方法本身不会向Web服务器发送请求。实际上是XMLHttpRequest.send()方法发送的请求。

还需要注意,在旧版浏览器中,例如,MicroSoft Internet Explorer 6或者更早,你可能不能实用上面简单的方法初始化XMLHttpRequest:new XMLHttpRequest。根据不同的客户端配置,你最好使用下面两个语句之一来代替:

oRequest = new ActiveXObject("Msxml2.XMLHTTP");
oRequest = new ActiveXObject("Microsoft.XMLHTTP");
 
目录
相关文章
|
15天前
|
JavaScript 前端开发 容器
AJAX载入外部JS文件到页面并让其执行的方法(附源码)
AJAX载入外部JS文件到页面并让其执行的方法(附源码)
17 0
|
3月前
|
前端开发 JavaScript
js + ajax实现商品列表页到详情页的跳转
js + ajax实现商品列表页到详情页的跳转
|
4月前
|
XML JSON 前端开发
深入了解JavaScript中的AJAX和HTTP请求
深入了解JavaScript中的AJAX和HTTP请求
|
4月前
|
敏捷开发 JavaScript 前端开发
❤❤❤【Vue.js最新版】sd.js基于jQuery Ajax最新原生完整版for凯哥API版本❤❤❤
❤❤❤【Vue.js最新版】sd.js基于jQuery Ajax最新原生完整版for凯哥API版本❤❤❤
|
1月前
|
JavaScript 前端开发
node.js第四天--ajax在项目中的应用
node.js第四天--ajax在项目中的应用
27 0
|
1月前
|
XML 前端开发 JavaScript
node.js第三天-----ajax(3)
node.js第三天-----ajax(3)
26 0
|
1月前
|
JSON JavaScript 前端开发
node.js第三天-----ajax(2)
node.js第三天-----ajax(2)
23 0
|
1月前
|
JSON 前端开发 JavaScript
node.js第三天-----ajax(1)
node.js第三天-----ajax(1)
35 0
|
3月前
|
XML JSON 前端开发
|
3月前
|
JSON 前端开发 JavaScript
JavaScript学习 -- ajax方法的POST请求
JavaScript学习 -- ajax方法的POST请求
29 0