JavaScript FAQ(九)——Ajax

 七、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");

 

时间: 2024-09-21 12:30:28

JavaScript FAQ(九)——Ajax的相关文章

Asynchronous JavaScript and XML (AJAX) 的初步认识

ajax|javascript|xml 下载Ajax.dll  http://ajax.schwarz-interactive.de/csharpsample/default.aspx  第一个范例建议参考其QuickGuide,感觉不错再这里引用一下AJAX .Net Wrapper quick usage guideKarl Seguin - http://www.openmymind.net/ - copyright 2005 (view AjaxGuide.doc for more de

JavaScript中的ajax功能的概念和示例详解_javascript技巧

AJAX即"Asynchronous Javascript And XML"(异步JavaScript和XML). 个人理解:ajax就是无刷新提交,然后得到返回内容. 对应的不使用ajax时的传统网页如果需要更新内容(或用php做处理时),必须重载整个网页页面. 示例: html代码如下 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>

【初窥javascript奥秘之Ajax】简述下你所知道的Ajax?

原文 http://www.cnblogs.com/yexiaochai/archive/2013/04/24/3037069.html [初窥javascript奥秘之Ajax]简述下你所知道的Ajax? 前言 ajax已经流行很多年了,现在来说它是否已经晚了呢???特别是有这样框架那样框架后,还有几个人认识原生ajax呢?我们每天都会用到的东西你到底对他了解吗? 在最近一次面试上不幸被问到了,原以为很熟悉的东西你会发现你对他根本不熟悉!要说熟悉AJAX的话你需要毫不犹豫回答以下问题: 1 不

JavaScript jquery及AJAX小结_javascript技巧

 其实在学习之前,就已经用上了js,jquery和ajax,不过当时不清楚这些的区别,就全都当成js来看,然后别人一说jquery,ajax都觉得好像很高级,等到自己学习的时候,倒是对这些更清楚了一点,下面就来写一下我的总结. 简介 Javascript JavaScript,一种直译式脚本语言,是一种动态类型.基于原型的语言,内置支持类.它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML网页上使用,用来给HTML网页增加动态功能.然而现在Ja

菜鸟蔡之Ajax复习第一篇(后台asp.net)(传统的JavaScript方法实现Ajax功能)_AJAX相关

其实最简单的可以理解为:JavaScript + XMLHttpRequest + CSS +服务器端的集合,其本质上是一种浏览器端的技术.好了, 简单的描述了一下,现在直接上代码吧! (1).功能描述: 新建两个html页面分别为1.html和2.html,在不刷新的情况下点击1.html页面上的"获取数据"按钮后,将2.html页中的内容显示在1.html页面的<div>标记中. (2).实现代码: 1.html实现代码: 复制代码 代码如下: <head>

javascript实现原生ajax的几种方法介绍_javascript技巧

自从javascript有了各种框架之后,比如jquery,使用ajax已经变的相当简单了.但有时候为了追求简洁,可能项目中不需要加载jquery这种庞大的js插件.但又要使用到ajax这种功能该如何办呢?下面和大家分享几种利用javascript实现原生ajax的方法. 实现ajax之前必须要创建一个 XMLHttpRequest 对象.如果不支持创建该对象的浏览器,则需要创建 ActiveXObject,具体方法如下: 复制代码 代码如下: var xmlHttp; function cre

javascript模拟实现ajax加载框实例_javascript技巧

本文实例讲述了javascript模拟实现ajax加载框的方法,分享给大家供大家参考.具体方法如下: 复制代码 代码如下: function loading(p_value,str) { if (p_value) { if (!document.getElementById("load_area")) { var para1 = document.createElement("span"); var node=document.createTextNode(str)

javascript 实现原生ajax的几种方法

自从javascript有了各种框架之后,比如jquery,使用ajax已经变的相当简单了.但有时候为了追求简洁,可能项目中不需要加载jquery这种庞大的js插件.但又要使用到ajax这种功能该如何办呢?下面和大家分享几种利用javascript实现原生ajax的方法.  实现ajax之前必须要创建一个 XMLHttpRequest 对象.如果不支持创建该对象的浏览器,则需要创建 ActiveXObject,具体方法如下:    代码如下 复制代码 var xmlHttp; function

JavaScript FAQ(一)—— 常见问题(一)

        今天在网上看到了一份很不错的JavaScript FAQ,由于担心自己并不能一直把它读完,所以就尝试翻译一些内容,和朋友们一起分享.        FAQ原地址:http://www.javascripter.net/faq/index.htm        一.常见问题        1.关于这个FAQ(About this FAQ)        Q:为什么要使用这个FAQ?        A:这个FAQ的目的是帮助你开发强壮的客户端脚本,它不但可以运行在Netscape N

JavaScript FAQ(四)——导航功能增强

 二.导航功能增强   1. 下拉菜单中的链接(Links in Select Menu) Q:我如何实现在下拉菜单中链接到不同的页面? A:要创建一个所示的下拉菜单:选择一个页面JavaScript FAQNumbersStringsNavigationColorsJavaScripter.net 你可以使用下面的代码: <form> <select onChange="if(this.selectedIndex!=0) self.location=this.options[