ajax 的根本步骤
1.注册
var xhr = new XMLHttpRequest();2.设置监听
xhr.onreadystatechange=function(){ if(xhr.readyState==4&&xhr.status==200){ console.log(xhr.responseText); }}3.连贯
xhr.open("GET","https:www.baidu.com",true);//true示意异步4.发送
xhr.send();post 申请须要申请头
//post申请要设置申请头xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");xhr.send("name="+name);post申请和get申请不同之处在一个是在url传值一个是在send()中传值，post申请须要设置申请头
为了减少代码的可重用性所以须要把xhr共性进行封装应用传值的模式来应用ajax
function submit(url,parmeter,callback){ var xxhyp = new XMLHttpRequest(); xxhyp.onreadystatechange=function(){ if(xxhyp.readyState==4&&xxhyp.status==200){ callback(xxhyp.responseText); } }xxhyp.open("POST",url,true);//post申请要设置申请头xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");xxhyp.send(parmeter);}//须要应用时代码示例function chaer(){var url = "dopost";var parmeter = "msg";submit(url,parmeter,function(result){ document.ElementById("loadid").innerHTNL=result; }); }//callback和function(result)造成了函数的回调~~~~//get申请相似Jquery-ajax
先得引入jquery的包哦
1.应用jquery-ajax的get申请
function doget(){var url = "dopost";var parmeter = "msg"; $.get(url,parmeter,function(result){ $("#loadid").html(result); }); }//get(url,params[,dataType])为jquery种的一个ajax函数,dataType--冀望然会的类型
2.应用jquery-ajax的post申请
function dopost(){var url = "dopost";var parmeter = "msg"; $.get(url,parmeter,function(result){ $("#loadid").html(result);~~~~ }); }3.应用jquer原生的ajax
function doajax(){ var url = "doget"; var parmeter = "msg"; $.ajax({ url:url, //url type:"GET", //指定提交办法 async:true, //指定异步还是同步 data:parmeter, //指定参数 success:function(result){ $("#loadid").html(result);~~~~ } });}4.应用load形式
function doload(){ var url = "doget"; var parmeter = "msg"; $("#loadid").load(url,parmeter,function(){ console.log("console管制tai"); }) }