ajax及在jquery中ajax的使用

ajax使用

• 创建一个xhr对象

  var xhr=new XMLHttpRequest();
  

请求过程中readyState会发生变化
0.初始状态
1.创建状态
2.客户端向服务端发送数据
3.服务端开始向数据端返回数据
4.客户端接收数据完毕
xhr.onload发生在客户端结束之后执行

• xhr.open创建一个连接

  xhr.open("post","json.php",true);
  

• 通过send发送数据
  FormData可以模拟表单对象

  var formData=new FormData();
  formData.append("name",img.files[0]);
  shr.send(formData);
  

jquery中Ajax使用

• Ajax对象
  jquery Ajax 是对xmlHttprequest对象的封装，基本方法就是ajax()，ajax参数是一组对象

  $.ajax({
  //post方法
    type:"post",//数据提交类型
    url:"danmu.php",//请求地址
    data:{word:"abc",username:"luxp"},//发送数据
   //get方法
    type:"get",//数据提交类型
    url:"getdanmu.php",//请求地址
    data:{},//发送数据
    dataType:"json",//返回数据的类型
    async:true,//是否异步
    //success为数据加载完后的回调函数
    success:function(data){
        var show=document.getElementById("show");
        for(i in data){
            show.innerHTML+=data[i];
            $("#show").html($("#show").html()+data[i]+"<br/>")
        }
    }
  });
  

• load方法
  load 参数 加载的页面地址,加载完成后,自动的添加到元素

    $("#show").load("http://localhost/%E6%88%91%E7%9A%84PHP/day5/index.html?ff");
  

• get
  get 第一个值src 第二个data 第三个 函数 第四个值 type类型

   $.get("getdanmu.php",{},function(data,status){console.log(data,status);document.body.innerHTML=data[2];},"json");
  

• post
  post 第一个值src 第二个data 第三个 函数 第四个值 type类型

   $.post("danmu.php",{word:"abc",username:"luxp"},function(data,status){console.log(data,status);
   document.body.innerHTML=data;},"json"); 
  

以上都是我们比较经常使用的方法。