如何使用局部刷新Ajax技术
这篇文章主要介绍"如何使用局部刷新Ajax技术"，在日常操作中，相信很多人在如何使用局部刷新Ajax技术问题上存在疑惑，小编查阅了各式资料，整理出简单好用的操作方法，希望对大家解答"如何使用局部刷新Ajax技术"的疑惑有所帮助！接下来，请跟着小编一起来学习吧！
1. Ajax的概念?
「以前浏览器如何实现通信呢：」
Jsp页面发送请求--->servlet进行接收--->数据放到域对象--->转发给jsp页面
同步的发送请求：这个请求的特点，我们每一次的转发，浏览器都要重新渲染整个页面、假设我的页面有100k的数据，只有1k的数据需要刷新，如果使用转发的方式的话那么每一次渲染的数据都是100k，这样浏览器的渲染压力就变大了
「Ajax技术实现通信：」
引入Ajax：假设我们使用了Ajax的技术的话，那么我们这100k的数据我们有99k的数据都不需要刷新，只是需要刷新这1k的数据，这就是Ajax
在一开始的时候，所有的浏览器并不支持所谓的局部刷新技术，而且一开始大多数的浏览器并不看好这门技术，这个时候微软首先就在IE浏览器中引入了异步请求的这个概念，到后来看到了Ajax在浏览器上的优秀表现，于是其他的浏览器厂商也就引入了Ajax这个技术
含义：Ajax是用于网页上面进行局部刷新的一门技术
2、Ajax技术的优缺点
「Ajax技术优点：」
核心技术：Ajax的核心技术是XMLHttpRequest，它是JavaScript中的一个对象
减轻了服务器端负担，将一部分以前由服务器负担的工作转移到客户端执行，利用客户端闲置的资源进行处理
在只局部刷新的情况下更新页面，增加了页面反应速度，使用户体验更友好
「Ajax技术缺点：」
Ajax的缺点是不利于SEO推广优化，因为搜索引擎无法直接访问到Ajax请求的内容
3、Ajax技术能干嘛?
「主要作用：」
发送同步或者异步请求
进行网页的局部刷新
下拉列表的数据来源于服务器的这种
做前后分离的开发
表单元素的动态认证
4、Ajax技术的具体使用
「使用步骤：」
创建获取Ajax对象的方法
function getAjax () { var ajax; try{ ajax=new ActiveXObject("microsoft.xmlhttp"); }catch(e){ try{ ajax=new XMLHttpRequest(); }catch(e){ alert('异步都没有 换浏览器吧....'); } } return ajax; }获取Ajax对象
var ajax=getAjax();
准备发送Ajax请求
ajax.open("GET","${pageContext.request.contextPath}/dates.action");发送Ajax请求
ajax.send(null);
监听Ajax中4种状态
ajax.onreadystatechange=function(){ if(ajax.readyState==4){ / } }判断服务器是否成功响应
if(ajax.status==200){//说明服务器的响应是正确的 var time=ajax.responseText; //要将这个数据直接赋值给一个一个标签 document.getElementsByTagName('span')[0].innerText=time; }Get方法数据传输（放到url后面）
ajax.open("GET","${pageContext.request.contextPath}/dates.action?userName=qianyu&password=123");Post方式发送请求和数据
//设置请求头 ajax.setRequestHeader("Content-type","application/x-www-form-urlencoded"); //发送数据 ajax.send("userName=qianyu&password=123");到此，关于"如何使用局部刷新Ajax技术"的学习就结束了，希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习，快去试试吧！若想继续学习更多相关知识，请继续关注网站，小编会继续努力为大家带来更多实用的文章！
