JavaScript 实现 AJAX 的完整示例：GET 与 POST 请求
本文详细介绍如何使用 JavaScript 实现 AJAX 技术，涵盖 XMLHttpRequest 对象的创建及 ActiveXObject 兼容处理。通过完整示例代码演示了 GET 和 POST 两种异步请求的具体实现方式，包括参数编码、状态监听及错误处理，帮助开发者快速掌握网页局部更新的核心技术。
AJAX 技术概述
AJAX 全称为 Asynchronous JavaScript and XML（异步 JavaScript 和 XML）。
AJAX 是一种用于创建快速动态网页的技术方案。
AJAX 允许网页在后台与服务器交换少量数据，从而实现页面的异步更新。这意味着用户可以在不重新加载整个网页的情况下，仅对网页的特定部分进行更新。
XMLHttpRequest 对象创建
在实现 AJAX 功能之前，必须首先创建一个 XMLHttpRequest 对象。如果当前浏览器不支持该对象，则需要使用 ActiveXObject 进行创建。具体实现方法如下：
var xmlHttp;
function createxmlHttpRequest()
{
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else if
(window.XMLHttpRequest)
{
xmlHttp=new XMLHttpRequest();
}
} GET 请求实现示例
（1）利用上述创建的 xmlHttp 对象，实现最简单的 AJAX GET 请求：
function doGet(url)
{
// 注意在传参数值的时候最好使用encodeURI处理一下，以防出现乱码
createxmlHttpRequest();
xmlHttp.open("GET",url);
xmlHttp.send(null);
xmlHttp.onreadystatechange = function()
{
if ((xmlHttp.readyState == 4) && (xmlHttp.status == 200)) {
alert('success');
}
else
{
alert('fail');
}
}
} POST 请求实现示例
（2）利用上述创建的 xmlHttp 对象，实现最简单的 AJAX POST 请求：
function doPost(url,data)
{
// 注意在传参数值的时候最好使用encodeURI处理一下，以防出现乱码
createxmlHttpRequest();
xmlHttp.open("POST",url);
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlHttp.send(data);
xmlHttp.onreadystatechange = function()
{
if ((xmlHttp.readyState == 4) && (xmlHttp.status == 200))
{
alert('success');
}
else
{
alert('fail');
}
}
} 以上介绍了使用 JavaScript 实现 AJAX 的完整示例代码，希望能为读者提供帮助。在使用过程中若有任何疑问，欢迎留言，小编会及时回复。感谢大家对本站的支持，我们将继续努力提供更优质的内容！
JS合并多个数组的三种方法：concat、spread与flat
2026-11-05 17:39:45
JavaScript怎么准确判断数据类型：typeof、instanceof与Object.prototype.toString
2026-11-05 17:09:21
JS中将数组和对象混合组装为JSON字符串
2026-11-05 16:41:42
JS运算符优先级与结合性的区别是什么？
2026-11-05 13:22:02
JS Map怎么只遍历Key或Value
2026-11-05 13:00:36