<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>ajax</title>
<script type="text/javascript"><!--
function Ajax() {
var xmlHttpReq = null;
if (window.XMLHttpRequest) {
xmlHttpReq = new XMLHttpRequest();
} else {
if (window.ActiveXObject) {
var versions = ['Microsoft.XMLHTTP', 'MSXML.XMLHTTP', 'Microsoft.XMLHTTP',
'Msxml2.XMLHTTP.7.0', 'Msxml2.XMLHTTP.6.0',
'Msxml2.XMLHTTP.5.0', 'Msxml2.XMLHTTP.4.0',
'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP'];
for(var i=0; i<versions.length; i++) {
try {
xmlHttpReq = new ActiveXObject(versions[i]);
if(xmlHttpReq) {
break;
}
} catch(e) {}
}
}
}
var handler = null;
this.invoke = function (mode, url, value, _handler) {
handler = _handler;
if(mode == 'get') {
var querystring = url+'?'+value+'&'+Math.random();
if(window.XMLHttpRequest) {
xmlHttpReq.open('GET', querystring);
xmlHttpReq.onreadystatechange = this.callback;
xmlHttpReq.send(null);
} else {
xmlHttpReq.open('GET', querystring, true);
xmlHttpReq.onreadystatechange = this.callback;
xmlHttpReq.send();
}
}
else if(mode == 'post') {
xmlHttpReq.open('POST', url);
xmlHttpReq.onreadystatechange = this.callback;
xmlHttpReq.setRequestHeader('Content-Type',
'application/x-www-form-urlencoded');
xmlHttpReq.send(value);
}
};
this.callback = function () {
if (xmlHttpReq.readyState == 4) {
if (xmlHttpReq.status == 200) {
handler(xmlHttpReq.responseText);
} else {
alert("请刷新页面！");
}
}
};
}
// 调用示例
new Ajax().invoke(
"get",
"/index.php",
'name=hello',
run
);
function run(response) {
alert(response);
}
// --></script>
</head>
<body>
</body>
</html>
index.php
<?php
echo $_GET['name'];
// echo $_POST['name'];
?>
兼容 IE、firefox、chrome 等浏览器。
var querystring = url+'?'+value+'&'+Math.random();，Math.random() 主要是进行 GET 请求时为了防止缓存。
发送请求时，对数据最好进行 urlencode 编码。
示例代码：点击下载
By xhttp.cn 整理：http://www.xhttp.cn/2010/06/18
分享到：
相关推荐
ajax轻量级封装,简单实用,带有详细注释。 一、同一个对象可以发送多个请求，按顺序执行请求，有简单的超时机制,httpXMLRequest对象复用，无序的可以建立多个对象发送请求来实现； 二、兼容IE,FF，支持同步、异步...
**标题解析：** "自己用的简单封装AJAX类" 指的是作者为了个人使用需求，编写了一个简化的AJAX处理类。AJAX（Asynchronous JavaScript and XML）是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术，...
### AJAX代码及简单封装知识点详解 #### 一、引言 AJAX（Asynchronous JavaScript and XML）是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换来实现这一功能...
【简单封装Ajax】这篇文章主要探讨的是如何在JavaScript中对原生的XMLHttpRequest对象进行简单的封装，以便于在实际开发中更方便地进行异步数据请求。在Web开发中，Ajax（Asynchronous JavaScript and XML）是一种...
**AjaxTest 实用简单封装** Ajax（Asynchronous JavaScript and XML）技术是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换，使网页实现异步更新，大大提升了...
8. **jQuery和其他库**：jQuery等JavaScript库封装了AJAX操作，使其变得更简单易用。例如，$.ajax()、$.get()和$.post()是jQuery中的AJAX函数，它们提供了更友好的API和更丰富的功能。 9. **Promise和async/await**...
本小工具就是对Ajax进行的一种简单封装，适用于那些希望进行轻量级交互、不打算使用大型JavaScript框架的场景。 Ajax的核心在于通过JavaScript与服务器进行异步通信，它允许我们向后台发送请求，获取数据，然后在...
这个压缩包"原生js的AJAX封装以及实例展示.zip"包含了对AJAX的简单封装以及一个具体的增删改查（CRUD）操作实例，这将帮助我们深入理解如何在实际项目中应用AJAX。 首先，让我们了解一下AJAX的基本原理。AJAX的核心...
以下是一个简单的Ajax函数封装示例： ```javascript function ajaxRequest(url, method, callback, data) { var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function() { if (xhr.readyState === 4 ...
**简单Ajax示例：** ```javascript var xhr = new XMLHttpRequest(); xhr.open('GET', 'data.json', true); xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { var data ...
本话题将深入探讨“ajax封装的dll”，这是一种将Ajax功能封装到动态链接库（DLL）中的做法，使得开发者可以更方便地在项目中调用和利用Ajax功能。 首先，DLL（Dynamic Link Library）是Windows操作系统中的一种共享...
以下是一个简单的Ajax封装示例： ```javascript function ajax(url, type, callback, data) { var xhr = new XMLHttpRequest(); xhr.open(type, url, true); // 如果是POST请求，设置请求头 if (type === '...
简单的把Ajax请求封装了一下 目前只考虑了请求文本的情况。 超时处理。 某一时刻只能处理一次请求。
**Ajax（Asynchronous JavaScript and XML）**是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。...同时，现代前端框架如React、Vue和Angular等都提供了对Ajax操作的高级封装，简化了开发者的工作。
jQuery库通过其简单易用的API，极大地简化了Ajax操作，使得开发者无需关注底层的XMLHttpRequest对象，而是可以更专注于业务逻辑。 jQuery的Ajax方法主要包括`$.ajax()`, `$.get()`, `$.post()`, `$.getJSON()`等。...
以下是一个简单的Ajax类结构： ```javascript class AjaxRequest { constructor(url) { this.url = url; this.timeout = 5000; // 默认超时时间为5秒 this.request = null; } send() { if (this.request) {...
在这个“小程序使用es6封装ajax源码案例”中，我们将深入探讨如何利用ES6的Promise和模块化特性来优雅地实现Ajax请求，并将其应用到微信小程序的开发中。 首先，让我们理解一下核心概念： 1. **ES6**：这是...
这个Web项目实例展示了如何利用jQuery封装的AJAX功能实现异步加载，通过与Servlet配合，实现了客户端与服务器间JSON数据的交换。理解这些概念和实践，对于提升Web应用的用户体验和性能至关重要。通过深入学习和实践...
**JavaScript封装Ajax**通常涉及到以下几个关键步骤： 1. **创建XMLHttpRequest对象**：这是Ajax的基础，几乎所有的浏览器都内置了XMLHttpRequest对象，用于与服务器进行通信。首先，我们需要创建一个...
通过封装，我们可以将复杂的Ajax交互抽象成简单易用的类或函数，使得开发者可以专注于业务逻辑，而不是底层的网络通信细节。了解和掌握Ajax封装，对于提升Web应用的用户体验和开发效率有着显著的帮助。