a three-layer package of jQuery ajax

12.1jQuery package for Ajax
jQuery's ajax solve most browser compatibility problems
javascript when using ajax, need to use the XMLHttpRequest object, when using jQuery ajax, also need to use the XMLHttpRequest object

jQuery对Ajax的第一层次封装 $.ajax()
jQuery对Ajax的第二层次封装 $.get() $.post() load()
jQuery对Ajaxd的第三层次封装$.getJSON() $.getScript()

Precautions

$.get()$.post()中的参数不可以互换位置,不是缺一不可的
$.ajax()中的参数可以互换位置,不是缺一不可的
$.get()/$.post()/$.ajax()会自动将服务器返回的 JSON 字符串转换成 JavaScript 对象

12.2 jQuery first level package for Ajax

$ .Ajax () method

1) Usage: $ ajax ({...}) , the parameter order does not matter.
2) parameters are as follows:
①url (String): request address.
②type (string): GET / POST .
③data (object / string): request parameter.
④dataType (string): expected data type returned by the server.
A.html: returns a html document. B.text: returns plain text.
C.json: returns json string. D.xml: returns a Xml document.
E.script: returns a javascript script
⑤success (function): callback function to call when the request is successful, there are two parameters function (data, textStatus),
wherein data is the data returned by the server, textStatus status description string.
⑥error (function): when the function call request fails, there are three parameters function (XHR, textStatus, errorThrown):
A.xhr: underlying XMLHttpRequest object. B.textStatus: description of the error. C.errorThrown: General is null.
⑦async: true (default, asynchronous) / false (synchronous)

$.ajax({
	url : "/servlet/DemoServlet",//地址
	type : "post",//请求类型
	data : {
		"name" : $("#name").val()
	},//要传的值，以键值对的形式存在
	dataType : "text",
	success : function(data) {//data是变量，是服务器传到jsp的数据。相当于以前从Servlet转发到jsp
		alert(data + "从Servlet传过来的数据");
	}
});

12.3 jQuery Ajax second level package
1. $. Get () method

1) Action: Using the get request to the server send mode.
2) Usage: $ GET (URL, [Data], [the callback], [type]);.
①url: request address.
②data: request parameters, there are two forms: A string request:. "Name = chang && age = 23" B objects form:. { 'Name': ' chang', 'age': 23}.
③callback: it is a callback function Format: function (data, statusText),
wherein, data of the data returned by the server, the server process is a state of the statusText.
④type: type of data returned by the server, there are five:
a.html: returns an html document. B.text: returns plain text.
C.json: returns json string. D.xml: returns a Xml document.
E.script: returns a javascript script.

$.get('ActionServlet',function(data){
		$('#tb1').empty();//先清空之前的内容
		for(i=0;i<data.length;i++){ 
			$('#tb1').append( '<tr><td>'+data[i].name+'</td><td>'+data[i].code+'</td><td>'+data[i].price+'</td></tr>'); 
		}
	},
	'json'
	);//ActionServlet 中发送的是 JSON 字符串，所以此处写 json

2. $.post () method uses the HTTP post request to load data from the server. usage:$ .post (URL, Data, function (Data, Status, XHR), DataType) get method with the same.

3.load () method to load data from the server, and replace the contents of elements of the current match the returned html content.
load () function uses the GET method by default, if the object is provided in the form of data, it is automatically converted to the POST method.
load () function only replacing the internal contents of each matching element (innerHTML).
$ (selector) .load (url, data, function (response, status, xhr))
the contents of the file "demo_test.txt" loaded to the specified

element:

$("button").click(function(){
		$("#div1").load("demo_test.txt");
	});

12.4 jQuery Ajaxd third level package
. 1 jQuery.getJSON ()
the getJSON () method of HTTP GET request using AJAX JSON data acquisition.
JSON is a data format, JS native support for JSON format, by jQuery.getJSON () JSON data obtained from the server, jQuery will first try to convert it to a corresponding JS object.
Syntax $ (selector) .getJSON (url, data, success (data, status, xhr))
using Ajax JSON request to obtain data, and outputs the result:

$(document).ready(function(){
    $("button").click(function(){
        $.getJSON("action.jsp?m=list ",function(result){
		// jQuery将获取的JSON格式数据转换为JS数组
 		 for(var i in data){
     			var obj = data[i];
        		alert( obj.title );
    		}
           });
    });
});

2 jQuery.getScript ()
using AJAX request, obtain and run the JavaScript:
for HTTP GET form by loading JavaScript file and run it.
This function is used to dynamically loading JS file, and the code execution of the JS file at global scope.
This function can load cross-domain JS file. Note that this function is to load data asynchronously.

$("button").click(function(){
	//加载并执行js文件demo_ajax_script.js?v=1.3
	//并在成功后执行回调函数
	$.getScript( "demo_ajax_script.js?v=1.3", 
		function(data){  
			alert( "加载成功" );    
			// 这里假设加载的js文件中定义了函数renderUI()，这里即可执行
    			renderUI();
		}
	 );
});