码迷,mamicode.com
首页 > Web开发 > 详细

jQuery_review之 原生Ajax的写法

时间:2014-07-28 00:00:39      阅读:248      评论:0      收藏:0      [点我收藏+]

标签:style   http   java   使用   os   io   cti   html   

    最低层的ajax的实现是基于浏览器的一个标准,就是XMLHttpRequest对象,这种对象在MS浏览器上面的实现与其他浏览器上面的实现是不一样的。尽管现在非常多的第三方框架采用”模板模式“封装了如何获取XMLHttpRequest对象以及如何发送和处理中间出现的异常,但是还是非常有必要对ajax进行一次复习,这样才能在看其他的方法的时候温故而知新的效果。

    编写原生的ajax的代码,需要需要采用的步骤是,首先,我们应当在function中定义一个XMLHttpRequest的变量对象,然后对这个变量对象进行初始化,这里应该注意的事情是,在不同的浏览器下面得到该对象的方式是不一样的,在MS中,我们使用的是ActiveXObjct的方式来获取,在其他的浏览器下面使用的是window的子对象。在该变量对象初始化之后,使用.open来分别定义参数来指定该XMLHttpRequest对象的使用什么方式来获取信息?要获取信息的URL是什么?以及是同步还是异步来进行获取呢?最后,需要指定这个函数在请求返回之后的回调函数,在回调函数中,根据状态信息和状态码信息来采取相应的动作,最后,使用XMLHttpRequest对象的send方法,发送ajax请求。

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  	<script type="text/javascript" src="jquery-1.8.3.js"></script>
	<script type="text/javascript">
  		function ajax(){
  			var xmlHttpRequest = null;
  			if(window.ActiveXObject){
  				xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
  			}else if(window.XMLHttpRequest){
  				xmlHttpRequest=new XMLHttpRequest();
  			}
  			xmlHttpRequest.open("GET","test",true);
  			xmlHttpRequest.onreadystatechange=callBack;
  			xmlHttpRequest.send(null);
  			
  			function callBack(){
  				if(xmlHttpRequest.readyState==4){
  					if(xmlHttpRequest.status ==200){
  						document.getElementById("showText").innerHTML 
  							= xmlHttpRequest.responseText;
  					}
  				}
  			}
  		}
  	</script>
  </head>
  <body>
  	<div id="showText"></div>
  	<input type="button" onclick="javascript:ajax()" value="sendAjax">
  </body>
</html>



jQuery_review之 原生Ajax的写法,布布扣,bubuko.com

jQuery_review之 原生Ajax的写法

标签:style   http   java   使用   os   io   cti   html   

原文地址:http://blog.csdn.net/ziwen00/article/details/38174341

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!