jquery的ajax

jquery的ajax

jquery的ajax分为三层

1.最顶层 $.getJSON(); $.getScript();

 $.getJSON("./config.json",function(data){   //加载json  不需要JSON.parse()的转换
   console.log(data);
})

$.getScript("./a.js",function(){  //加载js文件   js中的变量可以可以直接在这里使用
    obj.c();
})    

2.中间层 $.get(); $.post() $("div").load();

$.get("http://localhost:4006?user=xietian&age=30",function(data){   //2个参数    data是返回的数据
     console.log(data);
}); 

$.get("http://localhost:4006","user=xietian&age=30",function(data,success,xhr){   //3个参数
    console.log(data,success,xhr);
});

 $.post("http://localhost:4006",{user:"xietian",age:30},function(data){   //3个参数
    console.log(data);
})

//load是综合性能最强的,json,js加载,请求通信都可以 
$("div").load("http://localhost:4006",{user:"xietian",age:30});          //只有load是针对jquery对象的   直接写入到页面中
$(document).load("http://localhost:4006",{user:"xietian",age:30},function(data){  //   控制台打印
     console.log(data);
})
$("div").load("./2、jQuery插件.html")  //加载html页面
$(document).load("./a.js",function(data){         //加载完js文件,还需要放入到body中
   var script=document.createElement("script");
   script.innerHTML=data;
   document.body.appendChild(script);
   obj.c();
 })

 $(document).load("./config.json",function(data){  //加载json文件,需要JSON.parse()转换
   console.log(JSON.parse(data));
})

3.最底层 $.ajax()

$.ajax({                                                      //默认是get方式发送
    url: "http://localhost:4006?user=xietian&age=30",
    success: function (data) {
        console.log(data);
    }
})


//post发送
$.ajax({
    url: "http://localhost:4006",
    type: "POST",
    data: { user: "xietian", age: 30 },
    success: function (data) {
        console.log(data);
    }
})

//jsonp
$.ajax({
    url: "https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd=谢天&json=1&p=3&sid=22084_1436_13548_21120_22036_22073&req=2&csor=0&cb=callback",
    type: "GET",            //jsonp只能用GET来发送
    dataType: "jsonp",
})

function callback(data) {
    console.log(data);
}

//form表单
$("form").on("submit", function (e) {      //必须开启服务才能执行
    e.preventDefault();
    /*console.log($("[name=user]").val());   //服务器返回来的数据
      console.log($("[name=age]").val()); */
    // var fd=new FormData($("form")[0]);
    // console.log(fd);
    // console.log($("form").serialize());//queryString序列化
})