1 获得Ajax对象
1.1 问题
如何获得XmlHttpRequest对象。
1.2 方案
区分浏览器，使用不同的获取方式。
1.3 步骤
步骤一： 新建ajax01.html页面
新建一个Web工程，在WebRoot下新建ajax01.html页面。在<script>标记内编写JavaScript代码实现获取Ajax对象。
<script type="text/javascript"> /*获取Ajax对象*/ function getXhr(){ var xhr = null; //确保IE7,IE8，FireFox下可以运行 if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); }else{ //确保IE6可以运行，无视更古老的IE浏览器 xhr = new ActiveXObject("Microsoft.XMLHttp"); } return xhr; //更简易的写法 //xhr = window.XMLHttpRequest? // new XMLHttpRequest():new ActiveXObject("Microsoft.XMLHttp"); } </script>步骤二： 部署项目访问ajax01.html页面
访问页面如图-2所示。
图 – 2
点击链接：
图 - 3
使用IE测试结果如图-4所示。
图 – 4
注意：本次测试使用的是IE11，但IE的早期5.5，6.0版本创建的都是ActiveXObject类型的。从IE7开始支持创建XMLHttpRequest的方式来获取Ajax对象。
1.4 完整代码
ajax01.html文件代码如下：
<html> <head> <title>ajax01.html</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript"> /*获取Ajax对象*/ function getXhr(){ var xhr = null; //确保IE7,IE8，FireFox下可以运行 if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); }else{ //确保IE6可以运行，无视更古老的IE浏览器 xhr = new ActiveXObject("Microsoft.XMLHttp"); } return xhr; //更简易的写法 //xhr = window.XMLHttpRequest? // new XMLHttpRequest():new ActiveXObject("Microsoft.XMLHttp"); } </script> </head> <body> <!-- 获取XMLHttpRequest对象 --> <a href="javascript:;" onclick="alert(getXhr());"> 获取Ajax对象 </a> </body></html>2 使用Ajax对象发送GET请求
2.1 问题
使用Ajax对象发送GET类型的请求，从服务器端获取一小段文本。
2.2 方案
遵循创建Ajax对象，创建请求，设置回调函数，发送请求的步骤来完成一次异步请求。
新闻热点
疑难解答
图片精选
