Jquery Ajax—我耀学IT

1. $.ajax

jquery调用ajax方法:

格式:$.ajax({});

参数:

type:请求方式get/post

url:请求地址

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

data:发送到服务器的数据

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

contentType:设置请求头

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

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

get请求

javascript 复制代码
$.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文件,忽略返回值
javascript 复制代码
$.get('js/test.json');
复制代码
// 2.请求json文件,传递参数,忽略返回值
javascript 复制代码
$.get('js/test.json',{name:"tom",age:100});
复制代码
// 3.请求json文件,那到返回值,请求成功后可拿到返回值
javascript 复制代码
$.get('js/test.json',function(data){
    console.log(data);
});
复制代码
// 4.请求json文件,传递参数,拿到返回值
javascript 复制代码
$.get('js/test.json',{name:"tom",age:100},function(data){
    console.log(data);
})

3. $.post

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

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

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

4. getJSON

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

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

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

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

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

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

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

相关推荐
坊钰26 分钟前
【Java 数据结构】移除链表元素
java·开发语言·数据结构·学习·链表
巫师不要去魔法部乱说1 小时前
PyCharm专项训练4 最小生成树算法
算法·pycharm
IT猿手1 小时前
最新高性能多目标优化算法:多目标麋鹿优化算法(MOEHO)求解GLSMOP1-GLSMOP9及工程应用---盘式制动器设计,提供完整MATLAB代码
开发语言·算法·机器学习·matlab·强化学习
阿七想学习1 小时前
数据结构《排序》
java·数据结构·学习·算法·排序算法
王老师青少年编程1 小时前
gesp(二级)(12)洛谷:B3955:[GESP202403 二级] 小杨的日字矩阵
c++·算法·矩阵·gesp·csp·信奥赛
Kenneth風车2 小时前
【机器学习(九)】分类和回归任务-多层感知机(Multilayer Perceptron,MLP)算法-Sentosa_DSML社区版 (1)111
算法·机器学习·分类
越甲八千2 小时前
总结一下数据结构 树 的种类
数据结构
eternal__day2 小时前
数据结构(哈希表(中)纯概念版)
java·数据结构·算法·哈希算法·推荐算法
APP 肖提莫2 小时前
MyBatis-Plus分页拦截器,源码的重构(重构total总数的计算逻辑)
java·前端·算法
OTWOL2 小时前
两道数组有关的OJ练习题
c语言·开发语言·数据结构·c++·算法