JavaScript入门教程

JavaScript简介
JavaScript语法基础
JavaScript流程控制
JavaScript函数
面向对象编程
JavaScript事件
JavaScript DOM
正则表达式
JavaScript BOM
AJAX

专题分析

浏览器兼容性
JS优化
Web前端开发规范
编辑器推荐
总结和笔记

学习助手

对象参考手册
ECMAScript分析
数据中心
QQ交流群

AJAX 向服务器发送请求

创建 XMLHttpRequest 对象后,就可以向服务器发送请求了。

 XMLHttpRequest 对象的 open() 方法和 send() 方法用来向服务器发送请求。

注意:AJAX 向服务器发送的是 http 请求,与我们浏览网页时发送的 http 请求一样。我们可以右键查看当前网页的源代码,由很多 HTML、CSS和JavaScript 组成,如果我们使用 AJAX 请求当前的 URL ,返回的内容是一样的。

open() 方法

open() 方法用来初始化 HTTP 请求参数,但是并不发送请求。

语法:
    open(method,url,async)
参数说明:
参数 说明
method 必须参数。请求的类型,GET 或 POST。
url 必须参数。文件在服务器上的位置。
async 必须参数。是否异步发送请求,true(异步)或 false(同步)。

注意:AJAX 的强大之处在于异步请求,所以 async 一般设置为 true ,否则将失去意义。

例如,向演示文件发送一个类型为 GET 的异步请求:
open("GET" , "/demo/javascript/ajax/ajaxDemo.php?action=getIP" , true)

send()方法

send() 方法用来向服务器发送 HTTP 请求,并使用传递给 open() 方法的参数。

语法:
    send(string)
其中,string 为发送的内容,该参数仅仅在 POST 请求时有意义。

举例,发送一个类型为 GET 的异步请求:
xmlhttp.open("GET","/demo/javascript/ajax/ajaxDemo.php?action=getIP",true);
xmlhttp.send();
后台接收方式(PHP代码):
if($_GET['action']=="getIP"){
    $ip=$_SERVER["REMOTE_ADDR"];  // 获取 IP
    echo $ip;
}

发送一个类型为 POST 的异步请求:
xmlhttp.open("POST","/demo/javascript/ajax/ajaxDemo.php",true);
xmlhttp.send("action=getIP");
后台接收方式(PHP代码):
if($_POST['action']=="getIP"){
    $ip=$_SERVER["REMOTE_ADDR"];  // 获取 IP
    echo $ip;
}

一个发送 AJAX 请求的完整代码:
<script type="text/javascript">
var xmlhttp;
// 创建 XMLHttpRequest 对象
try{
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
}catch(e){
    // code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
// 初始化请求参数
xmlhttp.open("GET","/demo/javascript/ajax/ajaxDemo.php?action=getIP",true);
// 发送请求
xmlhttp.send();
</script>