ajax

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");
  })
 }