XMLHttpRequest

var xmlhttp = new XMLHttpRequest();

xmlhttp.onreadystatechange=function()

? ?{

? ? ? ? ? if (xmlhttp.readyState==4 && xmlhttp.status==200) {

? ? ? ? ? ? ? ? ?document.getElementById("myDiv").innerHTML=xmlhttp.responseText;?

? ? ? ? ? ? }

? ? ?}

xmlhttp.open("GET","test1.txt",true);

xmlhttp.send();

以上為一個請求的基本形式

如需將請求發(fā)送到服務(wù)器，我們使用 XMLHttpRequest 對象的 open() 和 send() 方法

如需獲得來自服務(wù)器的響應(yīng)，請使用 XMLHttpRequest 對象的 responseText 或 responseXML 屬性。

當請求被發(fā)送到服務(wù)器時，我們需要執(zhí)行一些基于響應(yīng)的任務(wù)。每當 readyState 改變時，就會觸發(fā) onreadystatechange 事件。

readyState 屬性存有 XMLHttpRequest 的狀態(tài)信息。

XMLHttpRequest 對象的三個重要的屬性

此外，如果需要像 HTML 表單那樣 POST 數(shù)據(jù)，請使用 setRequestHeader() 來添加 HTTP 頭。然后在 send() 方法中規(guī)定您希望發(fā)送的數(shù)據(jù)

xmlhttp.open("POST","ajax_test.asp",true);

xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");

xmlhttp.send("fname=Bill&lname=Gates");

jQuery ajax

jQuery 的 ajax 是對 XMLHttpRequest的封裝，它的用法一般有這幾種：

1 ）$.ajax

$.ajax({

? ? ? ? url:URL,

? ? ? ? type:'GET',

? ? ? ? dataType:"json",?

? ? ? ? success : function(data) { }

? ? ? ? error :function(er){ }

});

2 ) $.get ()

$(selector).get(url,data,success(response,status,xhr),dataType)

$.get()參數(shù)詳解

3 ) $.post()

jQuery.post(url,data,success(data, textStatus, jqXHR),dataType)

$.post()參數(shù)詳解

最后，目前前端用的最多的Fetch

Fetch API

fetch(URL).then(function(response){

? ? return response.json();

}).then(function(json){

insertPhotos(json);

});

ps:

POST和GET的選擇與區(qū)別

by.潘小閑