1:使用技术Ajax,json
同步现象:客户端发送请求到服务器端,当服务器返回响应之前,客户端都处于等待卡死状态。
异步现象:客户端发送请求到服务器端,无论服务器是否返回响应,客户端都可以随时做其他事情,不会被卡死。
Ajax的运行原理:页面发起请求,会将请求发送给浏览器内核中的Ajax引擎,Ajax引擎会提交请求到客户端,在这段时间里,客户端可以
进行任意操作,直到服务器端将数据返回给Ajax后,会触发你设置的事件,从而执行自定义的js逻辑代码完成某种页面功能。
json数据格式:
1>对象格式:{“key1”:obj,"key2",obj,"key3":obj....}
2>数组格式:[obj,obj,obj......]
注意:1>javascript:嵌入到html中的脚本代码,脚本代码可以动态修改页面的元素,修改的是内存那份元素,源码并没有被改变。
2>使用js原生的ajax完成异步操作,有5个步骤
a:创建Ajax引擎对象 var xmlhttp = new XMLHttpRequest();
b:为Ajax引擎对象绑定监听(监听服务器已将数据相应给引擎)
c:绑定提交地址
d:发送请求
e:接受响应数据
<input type="button" value="异步访问服务器端" οnclick="fn1()">
<script type="text/javascript"> function fn1() { //1创建ajax引擎对象---所有的操作都是引擎对象 var xmlhttp = new XMLHttpRequest(); //2绑定监听事件----监听服务器是否已经返回相应数据 xmlhttp.onreadystatechange = function () { //5接受响应数据 var res = xmlhttp.responseText; alert(res); } //3绑定地址 xmlhttp.open("GET","/ajaxServlet",true) //4发送请求 xmlhttp.send(); } </script>
urlPatterns="/ajaxServlet"的Java代码
response.getWriter().write("aaaaa");页面输出结果为:aaaaa