Ajax 使用ajax加上get和post方法，通过后台加载数据，并在网页上进行显示【案例+解释】

使用Ajax的GET和POST方法通常涉及到以下几个步骤：

1. 创建一个新的XMLHttpRequest对象。
2. 配置请求，包括指定响应函数。
3. 发送请求。

GET请求示例：

function getData(url) {
    var xhr = new XMLHttpRequest();
    xhr.open('GET', url, true);
    xhr.onreadystatechange = function () {
        if (xhr.readyState == 4 && xhr.status == 200) {
            // 请求成功
            var data = xhr.responseText;
            // 处理数据，例如显示在页面上
            document.getElementById('display').innerHTML = data;
        }
    };
    xhr.send();
}

POST请求示例：

function postData(url, data) {
    var xhr = new XMLHttpRequest();
    xhr.open('POST', url, true);
    xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
    xhr.onreadystatechange = function () {
        if (xhr.readyState == 4 && xhr.status == 200) {
            // 请求成功
            var response = xhr.responseText;
            // 处理数据，例如显示在页面上
            document.getElementById('display').innerHTML = response;
        }
    };
    xhr.send(data);
}

在这两个示例中，我们定义了两个函数getData和postData，它们都创建了一个新的XMLHttpRequest对象，并设置了请求方法和相应的处理函数。在getData函数中，我们通过URL直接发送GET请求，在postData函数中，我们发送一个带有数据的POST请求。在请求成功完成后，我们通常会更新页面上的某个元素来显示返回的数据。