AJAX入门教程

HELLOUKUVE

HELLOUKUVE

2016-02-19 18:25

get新技能是需要付出行动的,即使看得再多也还是要动手试一试。今天图老师小编跟大家分享的是AJAX入门教程,一起来学习了解下吧!

1.创建 XMLHttpRequest 对象

现在的浏览器有很多种,创建 XMLHttpRequest 的方法也不相同,所以为了兼容各种浏览器,在创建 XMLHttpRequest 时也应该考虑到各种浏览器的情况。目前主流的浏览器在Windows下有IE、Firefox及Opera,所以我们写的代码要尽量兼容这几个浏览器。在参考了一些资料后,我用下面的方法来创建 XMLHttpRequest 对象:

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

CODE:

// 先定义一个变量,并赋初值为 false,方便后面判断对象是否创建成功
var xmlObj = false;
// 使用 try 来捕获创建失败,再换个方法来创建
try {
// 在 Mozilla 中使用这种方式来创建 XMLHttpRequest 对象
xmlObj=new XMLHttpRequest;
}
catch(e) {
try {
// 如果不成功,那么尝试在较新 IE 里的方式
xmlObj=new ActiveXObject("MSXML2.XMLHTTP");
}
catch(e2) {
try {
// 失败则尝试使用较老版本 IE 里的方式
xmlObj=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e3) {
// 还是失败,那么就认为创建失败……
xmlObj=false;
}
}
}
// 如果创建 XMLHttpRequest 对象失败,那么提醒访问者该页面可能无法正确访问
if (!xmlObj) {
alert("XMLHttpRequest init Failed!");
}

2.使用 XMLHttpRequest 来获取 XML 文档

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

在用 XMLHttpRequest 来获取 XML 需要注意这个文档必需和自己在同一个域中,我的理解是同一个域名之下,或者同一目录之中,如果不是就会出现“拒绝访问”的错误。在本地高度时,也必需运行一个 Web 服务器,而不能直接在浏览器里打开这个网页。

CODE:

// 使用 open 方法来打开一个请求,这个方法有3个参数,分别是请求方式,请求文件的URL及同步方式(?不是很清楚具体叫什么来的:)
// 请求方式可以是 GET,POST,HEAD中的一种,因为我要获取文件,所以用 GET
// 请求文件的URL,直接用相对路径即可
// 同步方式,表示请求发出后是等待回应(false)还是继续执行下面的代码(true),即所谓异步了。AJAX的第一个A就是表示异步了,所以这里用 true
xmlObj.open ("GET", "sample.xml", true);
// 因为使用异步方式所以要在 XMLHttpRequest 对象的状态改变时做相应的处理
xmlObj.onreadystatechange=function() {
// 如果 XMLHttpRequest 的状态为4,应该是ready来的,那么继续处理
if(xmlObj.readyState==4) {
// 需要判断返回状态是否为200 OK,有些情况如文件不存在,就为返回404
if(xmlObj.status==200) {
// 一切OK,调用处理过程
DoMyXML();
}
}
}
// 发送请求,因为是GET,所以send的内容为null
xmlObj.send(null);

展开更多 50%)
分享

猜你喜欢

AJAX入门教程

Web开发
AJAX入门教程

AS入门教程

flash教程
AS入门教程

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

Mysql入门教程

编程语言 网络编程
Mysql入门教程

文字排版入门教程

电脑网络
文字排版入门教程

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

JSP入门教程(1)

Java JAVA基础
JSP入门教程(1)

JSP入门教程(2)

Java JAVA基础
JSP入门教程(2)

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

Win7系统3种电源模式让笔记本更适应环境

Win7系统3种电源模式让笔记本更适应环境

AJAX 开发的两种不同的方法

AJAX 开发的两种不同的方法
下拉加载更多内容 ↓