與 jQuery 聯網

9.1 jQuery 中的 $ 對象和 ajax 方法

jQuery 還有一個特殊的全局對像用於處理網絡。你可以猜到，它叫做$. 是的，就是這個名字。但它簡單方便。

假設您想在 JavaScript 中向 API 發送請求並處理收到的響應。這可以這樣做：

$.ajax({
  type: "POST",
  url: "api.codegym.cc",
  data: {name: 'Bill', location: 'Radmond'},
  success: function(msg){
    alert( "Person found: " + msg );
  }
});

就是這樣，這就是所有的代碼。我們調用對像上的$方法ajax()，我們傳遞描述我們需要的一切的對象：請求和響應。

• 該字段type指定 HTTP 請求的類型：GET或POST
• 該字段url指定url請求將發送到的目標。
• 該字段data指定JSON格式的請求數據
• success 字段指定在服務器成功響應後要調用的函數。

9.2 有用的查詢

但是如果你不需要傳輸任何數據，那麼請求可以寫得更短。例如，您可以像這樣編寫一個簡單的POST 請求：

$.post("ajax/test.html", function( data ) {
  $( ".result" ).html( data );
});

你知道代碼的作用$( ".result" ).html( data );嗎？讓我們試著猜測...

它在文檔中找到具有結果類的元素，並在其中添加 HTML 代碼 - 數據data。因此，您可以在幾行中從服務器下載數據並將其添加到您的頁面。怎麼樣，是不是很美？:)

GET 請求也可以寫成幾行：

$.get("ajax/test.html"., function( data ) {
  $( ".result" ).html( data );
});

您想下載並執行腳本嗎？

$.ajax({
  method: "GET",
  url: "test.js",
  dataType: "script"
});

獲取最新的 HTML 頁面？

$.ajax({
  url: "test.html",
  cache: false
})
  .done(function( html ) {
    $( "#results" ).append( html );
  });

互聯網上有一些非常好的 jQuery 文檔：

jQuery API

jQuery.ajax()

此外，所有常見問題都可以很容易地用谷歌搜索並在 StackOverflow 上找到。