什么是Ajax
Ajax 即“Asynchronous Javascript And XML”(异步 JavaScript 和 XML),是指一种创建交互式、快速动态网页应用的网页开发技术,可以不重新加载整个网页通过刷新网页部分内容达到数据的更新展示。可以有效的降低对带宽的需求,提高网页的性能;Ajax有同步和异步两种实现方式。
Ajax实例代码
前端代码--使用get请求
<html> <body> <div class="seodd"></div> </body> <script> var seodd = document.getElementById('seodd'); var seodd = new XMLHttpRequest();//创建ajax对象 seodd.onreadystatechange = function(){ if(this.readyState == 4){//4代表得到所有数据响应 if(this.status == 200){//服务端200,响应完成 success(this.responseText); } } } var url='';//数据提交地址 seodd.open('get',url,true);//true为异步;false为同步 seodd.send(); function success(data){ data = JSON.parse(data);//json转OBJ seodd.innerHTML = data.zan;//修改dom数据,.zan取决于后端传递多来的json数据中的参数名 } </script> </html>
前端代码--使用post请求
<html> <body> <form class="seodd"><input name="seodd"></form> </body> <script> var seodd = document.getElementById('seodd'); var seodd = new XMLHttpRequest();//创建ajax对象 seodd.setRequestHeader('content-type','application/x-www-form-urlencoded'); seodd.onreadystatechange = function(){ if(this.readyState == 4){//4代表得到所有数据响应 if(this.status == 200){//服务端200,响应完成 success(this.responseText); } } } var url='';//数据提交地址 seodd.open('post',url,true);//true为异步;false为同步 seodd.send('name=seoddcn'); function success(data){ data = JSON.parse(data);//json转OBJ seodd.innerHTML = data.seodd;//修改dom数据,data.seodd的seodd取决于后端传递多来的json数据中的参数名 } </script> </html>
在Ajax进行post请求的时候比起get请求,需要设置请求头“setRequestHeader('content-type','application/x-www-form-urlencoded');”;同时XXX..send(),get请求直接为空即可,对于post请求则是需要把请求参数写在里面。
后端代码
$data=array( "seodd"=>$a //将需要返回给前端的数据以数据的形式 ); echo json_encode($data);//将数据转化成一个json格式的数据
关注公众号“SEO_Study”回复"ajax请求"获取代码