Ajax实例应用和总结.docVIP

AJAX 简介: 全称为:异步(javaScript 和 xml) 分为三层含义: Asynchronous、JavaSciprt、And、XML 具体来说是借助异步的JavaSciprt实现浏览器和服务器之间的异步交互.无需加载整个页面就可以向服务器发送接收请求 Ajax解决方案的优势: Ajax 相当于在浏览器客户端之间架设了一个桥梁.一个媒介 在它的帮助下可以消除网络交互过程中的处理等待处理等缺陷 在处理的过程中Web服务器响应是标准的XML的数据传递给Ajax然后在转化为 Html页面格式,辅助CSS显示 AJAX相关的一个重要的对象XMLHttpRequest这个对象从IE5.0浏览器起就存在了它是Ajax技术中最重要的对象.XMLHttpRequest 对象是 Ajax 的核心之一。Ajax 的一个最大的特点是无需刷新页面便可向服务器传输或读写数据(又称无刷新更新页面)，这一特点主要得益于 XMLHTTP组件XMLHTTPRequest 对象。XMLHttpRequest 对象是主要的通信代理，实现客户端和服务器端的异步数据交互。 XMLHttpRequest 对象最早是由微软作为一个 ActiveX 对象实现的它是浏览器已经定义好的一个对象,它是Ajax技术的核心组成部分.需要注意的是.不同的IE浏览器对 XMLHttpRequest 定义方式有所不同 实例: 页面代码： %@ page language=java import=java.util.* pageEncoding=UTF-8% /head script //自定义AJAX引擎 var http_request=false; //初始化XMLHttpRequest对象 //浏览器的UI就是通过该对象与Ajax引擎打交道 function initXMLHttpRequest(){ if(window.XMLHttpRequest){ //Mozilla浏览器 http_request=new XMLHttpRequest(); if(http_request.overrideMineType){ //防止某些版本的Mozilla浏览器处理没有 Mine Type信息的 http_request.overrideMineType(text/xml); //内容出错. } } else if(window.ActiveXObject){ //IE浏览器 try{ http_request=new ActiveXObject(Msxml2.XMLHTTP); //IE6或更高版本 }catch(e){ http_request=new ActiveXObject(Microsoft.XMLHTTP); //IE5.x } } } function Onchange(){ initXMLHttpRequest(); //初始化XMLHttpRequest对象 //使用AJAX引擎的核心对象发送请求 http_request.open(post,/Ajax_Test/servlet/AjaxServlet?id=1,true); 注意路径 http_request.send(null); http_request.onreadystatechange=callBack; //设置回调函数 } function callBack(){ //AJAX引擎在服务器端成功返回后自动调用该函数 //负责将服务器端返回的数据显示在客户的UI上 if(http_request.readyState==4){ //服务器端已经处理完成 if(http_request.status==200){ //服务器端处理成功 var AJAX=document.getElementById(AJAX); AJAX.innerHTML=http_request.responseText; }else{ alert