14.JQuery发送Ajax请求

CDN引入 JQuery

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.7.1/jquery.min.js"></script>

1.发送 GET 请求

• 通过 $.get() 方式发送 Ajax 的 get 请求

• get() 有四个参数，第一个是 url，第二个是发送的参数（是一个对象），第三个参数是一个回调函数，回调函数有个参数是响应体，第四个参数是响应体类型，一般设置为 json

  // $.get(参数1，参数2，参数3，参数4)
  $.get("http://127.0.0.1:8000/jquery-server", { a: 1, b: 2 }, function (data) {
    console.log(data);
  }, 'json');

2.发送 POST 请求

• 通过 $.post() 方式发送 Ajax 的 get 请求

• post() 有四个参数，第一个是 url，第二个是发送的参数（是一个对象），第三个参数是一个回调函数，回调函数有个参数是响应体，第四个参数是响应体类型，一般设置为 json

  // $.post(参数1，参数2，参数3，参数4)
  $.post(
    "http://127.0.0.1:8000/jquery-server",
    { a: 1, b: 2 },
    function (data) {
      console.log(data);
    }, 'json'
  );

3.通用型ajax请求

• 通过 $.ajax() 方式发送通用型 ajax 请求
• ajax() 接收一个参数，是一个对象，对象里有一些属性，由属性来设置请求参数
• 属性有哪些：

  • url 发送的接口地址

  • data 发送的参数，是一个对象

  • type 请求的类型，比如 'get'

  • success 成功的回调函数

  • error 超时回调

  • timeout 超时时间

  • dataType 响应体类型

    $.ajax({
      url: "http://127.0.0.1:8000/jquery-server",
      data: {
        a: 1,
        b: 2,
      },
      type: "get",
      dataType: "json",
      success: function (data) {
        console.log(data);
      },
    });