什么是ajax?
Asynchronous JavaScript And XML 异步JavaScript和XML ,创建交互式的网页开发技术
是属于客户端与服务器之间交互的一种技术
与传统的交互比较
传统的交互(整个页面刷新+请求和响应同步处理)
浏览器发请求-->tomcat-->tomcat响应给浏览器-->jsp servlet处理 -->返回响应浏览器显示响应结果
使用Ajax交互(局部刷新和异步处理)
客户请求-->XMLHttpRequest发请求-->到tomcat-->XMLHttpRequest接受结果-->显示浏览器
Ajax好处
局部刷新和异步处理
提高了程序的交互效率(传递数量少)
提高用户体验(避免了整个页面的频繁刷新)
Ajax原理
Ajax是一系列技术的综合运用
基于js去发送请求和响应处理
以XMLHttpRequest对象为核心
涉及Html css 页面渲染技术
涉及xml,json等数据交互格式
//servlet响应设置字符: res.setContentType("text/plain;charset=utf-8");
使用JavaScript创建XMLHttpRequest
发送Http请求
回调函数
function sendRequest() {
var xhr = getXhr();
xhr.open("get","demo1.do",true);//创建一个http请求
//注册一个回调函数,请求处理完成之后调用
xhr.onreadystatechange= function(){
if(xhr.readyState==4){//请求处理完毕
//获取服务器返回的信息
var msg =xhr.responseText;
//将消息放到span span的id叫msg
document.getElementById("msg").innerHTML=msg;
}
};
xhr.send(null);//发送http请求
}
注释:
readyState: 0,1,2,3,4 4就是请求处理完毕
responseText 获取服务器返回的文本
responseXML 获取服务器返回的XML