Ajax全面基础学习（一）

快捷方法：

 

 

$.get()

$.get(url,[data],[callback],[type])

get方法的[data]将被链在url后面
[callback]是请求成功后的回调，可以得到响应数据，如果请求失败，看不到callback返回的内容
[type]是头部content-type定义的数据类型，如果返回的数据不能按照type规定的格式进行转换，也不会得到callback回调，因为被视为失败的请求

 

 

$.post()

$.post(url,[data],[callback],[type])

与get不同的是，post的[data]被放在requestBody里面，相对来说比较安全

携带数据的ajax请求方式
$.get('/test?x=1');　　　　可以直接将要发送的数据以 ?+data 的形式写在url后面
$.get('/test' , {x:2});　　  可以添加第二个参数，以json方式发送数据
$.post('/test',{y:2});　　　post方法不可以使用?+data 的形式

 

 

$.load()

load() 方法通过 AJAX 请求从服务器加载数据，并把返回的数据放置到指定的元素中（谁调用load方法，就把得到的数据放到谁中）。

load(url,[data],[callback])

　

注意：load方法不同于前面的get()和post(),它是一个局部方法，必须要一个jQuery对象来调用，如$("#container")

$("#container").load('test');    　　    //当没有[data]参数，是get方式请求


// 后台使get方式接收：
router.get('/list',function(req,res){
　　res.send(toHtml(users));
});

 

 

$("#container").load('test',{type:1},function(){alert(1)});    　　//有[data]参数，为post方式请求，所以从request.body 里得到type，而不是url直接取得


// 后台使用post方式接收：
router.post('/list',{type:1},function(req,res){
　　var ret = [];
　　var type = req.body.type; 
　　for(var i =0;i<users.length;i++){
　　　　if(users[i].type == type){
　　　　　　ret.push([users[i]]);
　　　　}
　　}
　　res.send(toHtml(ret));
});

function toHtml(users){
　　var ret = [];
　　for(var i=0 ;i <users.length;i++){
　　　　ret.push("<li>" + users[i].name + "</li>");
　　}
　　return "<ul>" + ret.join("") + "</ul>" ;
}

 

 

load()方法加载页面片段

load() 方法比 $.get()更强大，get()只能取回远程文档的所有数据，而load()允许我们取得远程文档的具体某个部分。这一点是通过 url 参数的特殊语法实现的。如果该字符串中包含一个或多个空格，紧接第一个空格的字符串则是决定所加载内容的 jQuery 选择器。

例如，这样就可以获得文档的某部分：

$("#result").load("ajax/test.html #container");

如果执行该方法，则会取回 ajax/test.html 的内容，不过然后，jQuery 会解析被返回的文档，来查找带有容器 ID 的元素。该元素，连同其内容，会被插入$("#result")中，所取回文档的其余部分会被丢弃。

 

 

$.getJSON()

$.getJSON(url,[data],[callback])　　// 多用于跨域请求

当后台返回的数据类型不是json，这里的callback就不会被执行

 

 

$.getScript()

$.getScript('/js/a.js',function(){})

用于动态加载script文件，即 在需要的时候才加载相应的script文件，有利于提高页面的加载速度