ajax
异步JavaScript和XML ,局部刷新
允许浏览器与服务器通信而无须刷新当前页面的技术
异步现象：客户端发送请求到服务端，无论服务是否返回响应，客户端都可以随意做其他事情，不会卡死。
原理：
当我们使用AJAX之后，浏览器是先把请求发送到XMLHttpRequest异步对象之中，异步对象对请求进行封装，然后再以http协议的方式发送给服务器。服务器并不是以转发的方式响应，而是以流的方式把数据返回给浏览器（因为不是转发的方式，所以是无刷新就能够获取服务器端的数据）
1.JS原生Ajax
总结：所有的异步访问都是ajax引擎
步骤：1.创建ajax引擎对象2.设置监听3.绑定地址 ture代表异步4.发送5.响应数据案例：
function checkUsername(){
// 获得文件框值: var username = document.getElementById("username").value; // 1.创建异步交互对象 var xhr = createXmlHttp(); // 2.设置监听 xhr.onreadystatechange = function(){ if(xhr.readyState == 4){ if(xhr.status == 200){ document.getElementById("span1").innerHTML = xhr.responseText; } } } // 3.打开连接 xhr.open("GET","${pageContext.request.contextPath}/user_findByName.action?time="+new Date().getTime()+"&username="+username,true); // 4.发送 xhr.send(null); }function createXmlHttp(){
var xmlHttp; try{ // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); } catch (e){ try{// Internet Explorer xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e){ try{ xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } catch (e){} } } return xmlHttp; }
readyState：请求状态readyState一改变，回调函数被调用，它有5个状态
0：未初始化1：open方法成功调用以后2：服务器已经应答客户端的请求3：交互中。Http头信息已经接收，响应数据尚未接收。4：完成。数据接收完成
Jquery是JS框架自然对js原生的ajax进行了封装，封装后的ajax操作更简洁更强大
其中三种常用的方法：1. $.get(url,[data],[callback],[type])：2. $.post(url,[data],[callback],[type])3. $.ajax({option1:value,option2:value2...});注解：
url:代表服务请求的服务器端地址data:代表请求服务器的数据callback：表示服务器端成功响应触发的函数（只有正常成功返回才执行）type:表示服务器返回的数据类型(jquery会根据指定的类型自动类型转换)
2.JQ的post/get方式
WEB7案例
function f1(){
$.get( "/WEB7/ss",//url {"name":"zz","age":11},//参数 function(xx){ alert(xx); }, "text" );}function f2(){
$.post( "/WEB7/ss",//url {"name":"zz","age":11},//参数 function(xx){ alert(xx); }, "text" );}3.JQ的ajax
案例模版：
//jq的ajax方法：
function f3(){ $.ajax({ url: "/WEB7/ss",type:"POST",async:true, //是否异步data:{"name":"s","age":44},success:function(xx){ alert(xx.name);}, /* error:function(){ alert("fail");}, */ dataType:"json", },);}<input type ="button" value="ajax" οnclick="f3()"/>