与 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 上找到。