Jquery Ajax

1.Ajax简介

​ ①Ajax是一种异步刷新技术,无需等待浏览器返回结果即可执行下一步操作

​ ②使得JavaScript可在不重载页面的情况与 Web 服务器交换数据,即在不需要新页面的情况下,就可以产生局部刷新效果

2.请求方式

2.1 Get请求和Post请求区别

​ Get请求和Post请求HTTP请求的两种方式

一、应用场景

​ ①幂等请求:指得是一个请求方法执行多次执行一次效果完全相同

​ ②Get请求:是幂等请求,一般用于服务器资源不会产生影响场景比如说请求一个网页资源

​ ③Post请求:不是幂等请求,一般用于服务器资源产生影响场景比如注册一个用户

二、是否缓存

​ 因为二者应用场景不同,浏览器一般对Get请求缓存,但很少对Post请求缓存

三、传参方式

​ ①Get请求:通过查询字符串传参

​ ②Post请求:通过请求体传参

四、安全

​ Get请求会将请求的参数放入URL中向服务器发送,因为请求的URL会被保留在历史记录中,所以相对于Post请求不是很安全

五、请求长度

浏览器会对URL长度限制,所以会影响Get请求发送数据长度

六、参数类型

​ Get请求:只允许ASCll字符

​ Post请求:支持更多的数据类型,如文件图片

2.2 $.ajax

​ Jquery最原始调用ajax方式格式$.ajax({})

参数 作用
Type 请求方式Get或Post
URL 请求地址url
async 是否异步默认true表示异步
data 发送服务器数据
dataType 预期服务器返回数据类型
contentType 设置请求头
success 请求成功调用函数
error 请求失败调用函数
 $.ajax({
    url:"js/data.json",
    type:"get",
    dataType:"json",
    success:function(data){
        console.log("__成功__");
        console.log(data);
    },
    error:function(jqxhr){
        console.log("失败");
        console.log(jqxhr);
    }
})

2.3

.

g

e

t

.get

.get.post、$.json

​ 请求成功时可调用回调函数,如果需要请求失败执行函数需要使用$.ajax

//1.请求json文件、忽略返回
$.get('js/data.json');
//2.请求json文件、传递参数、忽略返回
$.get('js/data.json'),{name = 'xiaoguo',age = '23'};
//3.请求json文件、请求成功后拿到返回
$.get('js/data.json',function(data){
    console.log(data);
});
//4.请求json文件、传递参数、拿到返回
$.get('js/data.json',{name = 'xiaoguo',age = '23'},function(data){
      console.log(data);
});
//5.请求json文件、传递参数、拿到返回值
$.post('js/data.json',{name = 'xiaoguo',age = '23'},function(data){
      console.log(data);
});
//6.请求json文件、传递参数、拿到返回值
$.json('js/data.json',{name = 'xiaoguo',age = '23'},function(data){
      console.log(data);
});

原文地址:https://blog.csdn.net/Chinaguo9873/article/details/131541349

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。

如若转载,请注明出处:http://www.7code.cn/show_9977.html

如若内容造成侵权/违法违规/事实不符,请联系代码007邮箱:suwngjj01@126.com进行投诉反馈,一经查实,立即删除

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注