jQuery中的Ajax

Posted 2020-09-03

jQuery对Ajax操作进行了封装，在jQuery中最底层的方法时$.ajax(),第二层是load(),$.get()和$.post()（最常用）,第三层是$.getScript()和$.getJSON()。

load()方法：load()方法是jQuery中最简单和常用的Ajax方法，能载入远程的html代码并插入到DOM中，它的结构是load(url[,data][,callback])

　　如果只需要加载目标HTML页面内的某些元素，则可以通过load()方法的URL参数来达到某的。通过URL参数指定选择符，就可以方便的从加载过来的HTML文档中选出所需要的内容，load()方法的URL参数的语法结构为“url selector”(注意url和选择器之间有一个空格)

　　传递方式：load()方法的传递参数根据参数data来自动自定，如果没有参数传递，采用GET方式传递，否则采用POST方式。

　　对于必须在加载完才能继续的操作，load()方法提供了回调函数，该函数有按个参数：代表请求返回内容的data；代表请求状态的textStatus对象和XMLHttpRequest对象

任何一个html节点都可以使用load方法来加载Ajax，结果将直接插入html节点中。

$.get()方法使用GET方式来进行异步请求，它的结构是：$.get（url[,data][,callback][,type]）;

 

1、什么是ajax？

不用刷新页面，但是可以和服务端进行通信的方式。使用ajax的只要方式是XMLHttpRequest对象

2、使用XMLHttpRequest对象实现ajax。

3.ajax传输数据的3种方式：

1）。xml：笨重，解析困难。但xml是通用的数据交换格式

2）。html：不需要解析可以直接放到文档中。若仅更新一部分区域。但传输的数据不是很方便，且HTML代码需要拼装完成。

3）。json：小巧，有面向对象的特征，且有很多第三方的jar包可以把Java对象或集合转为json字符串。

4、使用jQuery完成ajax操作

1）。load方法：可以用于html文档的元素节点，把结果直接加为对应节点的子元素。通常而言，load方法加载后的数据是一个html片段。

var $obj = ...

var url = ...

var args = {key:value,...};

$obj.load(url,args);

2）。$.get,$.post,$.getJSON:更加灵活。除去使用load方法的情况，大部分时候都使用这3个方法

一、基本的使用

//url:ajax请求的目标url

//args:传递的参数：json类型

//data:ajax响应成功后的数据。可能是xml，html，json

$.get(url,args,function(data){})

二、请求json数据

$.get(url,args,function(data){},"JSON");

$.post(url,args,function(data){},"JSON");

$.getJSON(url,args,function(data){})