Jquery ajax 详解（Day_16）

太在意别人的看法最后会有两种结局，要么自己累死，要么让别人整死。

---

　

• 简介

　　AJAX 是与服务器交换数据的技术，它在不重载全部页面的情况下，实现了对部分网页的更新。

　　简短地说，在不重载整个网页的情况下，AJAX 通过后台加载数据，并在网页上进行显示。

　　1、AJAX load 方法

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

注释：还存在一个名为 load 的 jQuery 事件方法。调用哪个，取决于参数。

语法:

load(url,data,function(response,status,xhr))

参数	描述
url	规定要将请求发送到哪个 URL。
data	可选。规定连同请求发送到服务器的数据。
function(responseTxt,statusTxt,xhr)	可选。规定当请求完成时运行的函数。 额外的参数： responseTxt - 包含来自请求的结果数据 statusTxt - 包含请求的状态（"success", "notmodified", "error", "timeout" 或 "parsererror"） xhr - 包含 XMLHttpRequest 对象

 下面的例子会在 load() 方法完成后显示一个提示框。如果 load() 方法已成功，则显示"外部内容加载成功！"，而如果失败，则显示错误消息：

1 $("button").click(function(){
2   $("#div1").load("demo_test.txt",function(responseTxt,statusTxt,xhr){
3     if(statusTxt=="success")
4       alert("外部内容加载成功!");
5     if(statusTxt=="error")
6       alert("Error: "+xhr.status+": "+xhr.statusText);
7   });
8 });

　　　2、$.AJAX

 1  语法：$.ajax({键值对});
 2        //使用$.ajax()发送异步请求
 3               $.ajax({
 4                   url:"ajaxServlet1111" , // 请求路径
 5                   type:"POST" , //请求方式
 6                   //data: "username=jack&age=23",//请求参数
 7                   data:{"username":"jack","age":23},
 8                   success:function (data) {
 9                       alert(data);
10                   },//响应成功后的回调函数
11                   error:function () {
12                       alert("出错啦...")
13                   },//表示如果请求响应出现错误，会执行的回调函数
14
15                   dataType:"text"//设置接受到的响应数据的格式
16               });

　　2、$.get() 方法

　　$.get() 方法通过 HTTP GET 请求从服务器上请求数据。

语法:

$.get(URL,[data],[callback],[type]);

　　使用 $.get() 方法从服务器上的一个文件中取回数据：

$("button").click(function(){
  $.get("demo_test.php",function(data,status){
    alert("数据: " + data + "\n状态: " + status);
  });
});

　　

　　2、$.post() 方法

　　$.post() 方法通过 HTTP POST 请求向服务器提交数据。

语法:

$.post(URL,[data],[callback],[type]);

　　使用 $.post() 连同请求一起发送数据：

1 $("button").click(function(){
2     $.post("/try/ajax/demo_test_post.php",
3     {
4         url:"AjaxServlet"
5     },
6     function(data,status){
7         alert("数据: \n" + data + "\n状态: " + status);
8     });
9 });

参数：	描述:
url	请求路径
data	请求参数
callback	回调函数
type	响应结果类型

• GET 和 POST 方法的区别：

1、发送的数据数量

　　在 GET 中，只能发送有限数量的数据，因为数据是在 URL 中发送的。

　　在 POST 中，可以发送大量的数据，因为数据是在正文主体中发送的。

2、安全性

　　GET 方法发送的数据不受保护，因为数据在 URL 栏中公开，这增加了漏洞和黑客攻击的风险。

　　POST 方法发送的数据是安全的，因为数据未在 URL 栏中公开，还可以在其中使用多种编码技术，这使其具有弹性。

3、加入书签中

　　GET 查询的结果可以加入书签中，因为它以 URL 的形式存在；而 POST 查询的结果无法加入书签中。

4、编码

　　在表单中使用 GET 方法时，数据类型中只接受 ASCII 字符。

　　在表单提交时，POST 方法不绑定表单数据类型，并允许二进制和 ASCII 字符。

5、可变大小

　　GET 方法中的可变大小约为 2000 个字符。

　　POST 方法最多允许 8 Mb 的可变大小。

6、缓存

　　GET 方法的数据是可缓存的，而 POST 方法的数据是无法缓存的。

7、主要作用

　　GET 方法主要用于获取信息。而 POST 方法主要用于更新数据。

---

PS:

如果，您希望更容易地发现我的新博客，不妨点击一下关注。

如果你觉得本篇文章对你有所帮助，请给予我更多的鼓励，

因为，我的写作热情也离不开您的肯定支持，感谢您的阅读，我是【肥肥也】！