Jquery Ajax—我耀学IT

1. $.ajax

jquery调用ajax方法:

格式:$.ajax({});

参数:

type:请求方式get/post

url:请求地址

async:是否异步,默认是true表示异步

data:发送到服务器的数据

dataType:预期服务器返回的数据类型

contentType:设置请求头

success:请求成功时调用此方法

error:请求失败时调用此函数

get请求

$.ajax({
    type:"get",
    url:"js/test.txt",
    async:true,
    data:{
        name:"tom"
    },
    dataType:"json",
    success:function(data){
        console.log(data);
    },
    // error一般不用
    error: function (XMLHttpRequest, textStatus, errorThrown) { 
                 $("#p_test").innerHTML = "there is something wrong!";
                 alert(XMLHttpRequest.status); 
                 alert(XMLHttpRequest.readyState); 
                 alert(textStatus);        
   }
})

[我耀学IT]  Patience is key in life

2. $.get

这是一个简单的get请求功能以取代复杂的$.ajax

请求成功时可调用回调函数。如果需要在出错时执行函数,请使用$.ajax

// 1.请求json文件,忽略返回值
$.get('js/test.json');
// 2.请求json文件,传递参数,忽略返回值
$.get('js/test.json',{name:"tom",age:100});
// 3.请求json文件,那到返回值,请求成功后可拿到返回值
$.get('js/test.json',function(data){
    console.log(data);
});
// 4.请求json文件,传递参数,拿到返回值
$.get('js/test.json',{name:"tom",age:100},function(data){
    console.log(data);
})

3. $.post

这是一个简单的post请求功能以取代复杂的$.ajax

请求成功时可调用回调函数。如果需要在出错时执行函数,请使用$.ajax

// 1.请求json文件,忽略返回值
$.post('js/test.json');
// 2.请求json文件,传递参数,忽略返回值
$.post('js/test.json',{name:"tom",age:100});
// 3.请求json文件,那到返回值,请求成功后可拿到返回值
$.get('js/test.json',function(data){
    console.log(data);
});
// 4.请求json文件,传递参数,拿到返回值
$.get('js/test.json',{name:"tom",age:100},function(data){
    console.log(data);
})

4. getJSON

这是一个简单的getJSON请求功能以取代复杂的$.ajax

请求成功时可调用回调函数。如果需要在出错时执行函数,请使用$.ajax

// 1.请求json文件,忽略返回值
$.getJSON('js/test.json');
// 2.请求json文件,传递参数,忽略返回值
$.getJSON('js/test.json',{name:"tom",age:100});
// 3.请求json文件,那到返回值,请求成功后可拿到返回值
$.getJSON('js/test.json',function(data){
    console.log(data);
});
// 4.请求json文件,传递参数,拿到返回值
$.getJSON('js/test.json',{name:"tom",age:100},function(data){
    console.log(data);
})

PS:getJSON方式要求返回的数据格式满足json格式

$.getJSON('js/test.txt',{name:"tom",age:100},function(data){
    console.log(data);
})

以上代码运行之后则不会出现运行结果

[我耀学IT]  Patience is the key to life

  • 22
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值