$.ajax() 方法简介

$.ajax() 是 jQuery 中用于执行 AJAX（Asynchronous JavaScript and XML）请求的底层方法。它允许你发起各种类型的 HTTP 请求（GET、POST 等），并且可以通过配置选项来精细控制请求的各个方面。

基本语法

$.ajax({
    url: "请求的URL",
    type: "请求类型（GET、POST等）",
    dataType: "预期服务器返回的数据类型（json、xml、html等）",
    success: function(data) {
        // 请求成功时的回调函数
    },
    error: function(jqXHR, textStatus, errorThrown) {
        // 请求失败时的回调函数
    }
});

常用选项

• url: 请求的 URL 地址。
• type: 请求的类型（”GET”、”POST” 等）。
• dataType: 预期服务器返回的数据类型（”json”、”xml”、”html” 等）。
• data: 发送到服务器的数据。
• success: 请求成功时的回调函数。
• error: 请求失败时的回调函数。

案例讲解：使用 $.ajax() 获取服务器数据

假设我们有一个服务器 API，可以通过 GET 请求获取用户信息，返回 JSON 格式的数据。

HTML 部分

<button id="getUserData">获取用户信息</button>
<div id="userInfo"></div>

jQuery 部分

$(document).ready(function() {
    $("#getUserData").click(function() {
        $.ajax({
            url: "https://api.example.com/user",
            type: "GET",
            dataType: "json",
            success: function(data) {
                var userInfo = "<h3>用户信息</h3>";
                userInfo += "<p>姓名: " + data.name + "</p>";
                userInfo += "<p>年龄: " + data.age + "</p>";
                userInfo += "<p>邮箱: " + data.email + "</p>";
                $("#userInfo").html(userInfo);
            },
            error: function(jqXHR, textStatus, errorThrown) {
                alert("请求失败: " + textStatus);
            }
        });
    });
});

解释

• 当点击按钮时，触发 AJAX 请求。
• 请求的 URL 是 “https://api.example.com/user”，请求类型为 GET。
• 预期服务器返回的数据类型为 JSON。
• 请求成功时，将用户信息显示在 `#userInfo` 元素中。
• 请求失败时，弹出提示框显示错误信息。