AJAX基本介绍

Ajax概念

Ajax 是Web 开发一个流行的词汇，全称 Asynchronous JavaScript andXML，异步的JavaScript和XML 。是几种技术的强强联合。

Ajax如何工作

Ajax（即异步 JavaScript 和 XML）是一种 Web 应用程序开发的手段，它采用客户端脚本与Web 服务器交换数据。

为什么要学习Ajax

使用Ajax的最大优点，就是能在不更新整个页面的前提下维护数据。这使得Web应用程序更为迅捷地回应用户动作，并避免了在网络上发送那些没有改变过的信息。

//兼容所有的浏览器 创建XHR对象
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}



var xmlhttp=null;

xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200){
retnFunction(xmlhttp.responseText);
}
}

1.xmlhttp.readyState==4 && xmlhttp.status==200 所代表的意义

xmlhttp.readyState=0：请求未初始化（没有调用send方法）
xmlhttp.readyState=1：服务器连接已建立（socket已连接）
xmlhttp.readyState=2：请求已接收（获取到了参数没有执行action方法）
xmlhttp.readyState=3：请求处理中（已经在执行action方法未执行完）
xmlhttp.readyState=4：请求已完成，且响应已就绪（已经响应并且能获取到最终的数据）
xmlhttp.status==200：响应状态 200表示成功

2.xmlhttp.open("GET","${pageContext.request.contextPath}/popo?foodname="+foodname,true)中true的含义

一个ajax线程是否执行完成可以通过回调函数xmlhttp.onreadystatechange 是否执行完成来判断
异步多个线程同时执行无法判断谁先执行 true
同步一次只允许一个线程执行 false

3.get和post请求

get：xmlhttp.open("GET","${pageContext.request.contextPath}/popo?foodname="+foodname,true);
xmlhttp.send();

post：xmlhttp.open("POST","${pageContext.request.contextPath}/popo",true);
//charset=UTF-8 解决乱码问题
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded;charset=UTF-8");
xmlhttp.send("foodname="+foodname);

注：有put delete

xmlhttp.send("_method=put&foodname="+foodname);

xmlhttp.send("_method=delete&foodname="+foodname);

猜你喜欢