<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>XMLHttpRequest</title>
<script>
var xmlHttp;　　　　//声明一个全局变量xmlHttp，主要是考虑到异步对象在整个页面进程中都有可能使用到。
function createXMLHttpRequest(){　　//创建一个异步对象的函数，
if(window.ActiveXObject)　　　　//该函数主要利用if语句进行浏览器的判断，如果是IE浏览器则采用ActiveXObject的创建方法，如果不是则直接利用XMLHttpRequest()函数，考虑兼容性，因此需要对浏览器进行判断，这基本是Ajax创建异步对象的通用方法。
xmlHttp=new ActiveXObject('Microsoft.XMLHTTP');
else if(window.XMLHttpRequest)
xmlHttp=new XMLHttpRequest();
}

function startRequest(){
createXMLHttpRequest();　　//调用已经写好的函数，创建一个异步对象
xmlHttp.open('GET','new_file.xml',true);　　//建立一个到服务器的请求， true是异步请求，open(method,url,asynchronous,user,password),asynchronous是一个布尔值，表示是否为异步请求，默认为异步请求true。user、password分别为可选的用户名、密码。
xmlHttp.onreadystatechange=function(){           //readystate属性判断目前请求的状态，如果该属性变化了，就会触发onreadystatechange事件。
if(xmlHttp.readyState==4 && xmlHttp.status==200)   //如果readyState的状态为4（数据接收成功）则继续操作。并且一般情况下还要判断服务器返回的响应状态status。
alert('服务器返回：'+xmlHttp.responseText);
}
xmlHttp.send(null);　　//将该请求发送给服务器。send(body); 参数body，它表示要向服务器发送的数据，其格式为查询字符串的形式，例如：var body="myName=isaac&age=25";
}
</script>
</head>
<body>
<input type="button" value="测试异步通信" onclick="startRequest()" />
</body>
</html>

注意：

　　如果使用POST方法进行提交请求，那么在发送前必须使用如下的语句来设置HTTP的头，语法如下：

　　xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

　　var queryString = "firstName=isaac&birthday=0624";

　　var url="9-3.aspx?timestamp="+new Date().getTime();

　　xmlHttp.open("POST",url);

　　xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

　　xmlHttp.send(queryString);  //该语句负责发送数据

　　2，解决异步连接服务器时IE的缓存问题

　　var sUrl="9-1.aspx?" + new Date().getTime();　　//地址不断的变化

　　xmlHttp.open("GET", sUrl, true);

Ajax异步交互 [异步对象连接服务器]的更多相关文章

  1. 实现AJAX的异步交互的步骤

    <input type="button" value="异步请求"id="btn"> <script> 实现ajax ...

  2. AJAX 异步交互基本总结

    AJAX (Asynchronous JavaScript and Xml) 直译中文 - javascript和XML的异步 同步与异步的区别: 同步交互 执行速度相对比较慢 响应的是完整的HTML ...

  3. Ajax异步交互基础

    1. ajax是什么? * asynchronous javascript and xml:异步的js和xml * 它能使用js访问服务器,而且是异步访问! * 服务器给客户端的响应一般是整个页面,一 ...

  4. 原生Ajax实现异步交互

    实现Ajax主要依靠XMLHttpRequest对象,所以首先要创建XMLHttpRequest对象 function getXhr(){ var xhr = null; if(window.XMLH ...

  5. spring mvc 和ajax异步交互完整实例

    Spring MVC 异步交互demo: 1.jsp页面: <%@ page language="java" contentType="text/html; cha ...

  6. 表单验证--通过原生js模仿ajax的异步交互

    今天给大家带来个福利,我也是刚刚学习的很实用的一个东西,通过原生js模仿ajax的异步交互. 我的博客只是给那些新手看的大神勿喷,写的不好可留言,请指出. 因为当初自己学的时候一个问题不会找人问,知道 ...

  7. 使用AJAX技术发送异步请求，HTTP服务端推送

    使用AJAX技术发送异步请求 什么是AJAX AJAX指一步Javascript和XML(Asynchronous JavaScript And XML),它是一些列技术的组合,简单来说AJAX基于X ...

  8. Ajax同步与异步优缺点与使用

    一.什么是同步请求:(false)       同步请求即是当前发出请求后,浏览器什么都不能做,必须得等到请求完成返回数据之后,才会执行后续的代码,相当于是排队,前一个人办理完自己的事务,下一个人才能 ...

  9. 使用html5 FileReader获取图片，并异步上传到服务器(不使用iframe)

    使用html5 FileReader获取图片,并异步上传到服务器(不使用iframe)   原理: 1.使用FileReader 读取图片的base64编码 2.使用ajax,把图片的base64编码 ...

随机推荐

  1. Bluetooth Obex

    OPP 1.2 which uses OBEX over L2CAP. OPP 1.1 connection and transfer happens over RFCOMM->L2CAP.

  2. FastDFS 集群 安装 配置

    这篇文章介绍如何搭建FastDFS 集群 FastDFS是一个开源的轻量级分布式文件系统,它对文件进行管理,功能包括:文件存储.文件同步.文件访问(文件上传.文件下载)等,解决了大容量存储和负载均衡的 ...

  3. angular-utils-ui-breadcrumbs使用心得

    angular-utils-ui-breadcrumbs是一个用来自动生成面包屑导航栏的一个插件,需要依赖angular.UIRouter和bootstrap3.css.生成的界面截图如下,点击相应的 ...

  4. 2015-2016 ACM-ICPC, NEERC, Southern Subregional Contest I Lottery

    LotteryCrawling in process... Crawling failed Time Limit:2000MS     Memory Limit:524288KB     64bit ...

  5. CREATE DATABASE RoomReservation

    要从我的模型开始构建我的RoomReservation数据库对象,我将创建表对象. 要在SQL Server中创建表,我需要使用CREATE TABLE语句. 使用CREATE TABLE语句,我将能 ...

  6. 在ASP.NET Core中使用AOP来简化缓存操作

    前言 关于缓存的使用,相信大家都是熟悉的不能再熟悉了,简单来说就是下面一句话. 优先从缓存中取数据,缓存中取不到再去数据库中取,取到了在扔进缓存中去. 然后我们就会看到项目中有类似这样的代码了. pu ...

  7. 桌面消息通知：HTML5 Notification

    先上一段完整代码 //注册权限 Notification.requestPermission(function (status) { // 这将使我们能在 Chrome/Safari 中使用 Noti ...

  8. 开发一个基于 Android系统车载智能APP

    很久之前就想做一个车载相关的app.需要实现如下功能: (1)每0.2秒更新一次当前车辆的最新速度值. (2)可控制性记录行驶里程. (3)不连接网络情况下获取当前车辆位置.如(北京市X区X路X号) ...

  9. 关于隐藏元素高度的问题 css visibility:hidden 与 display:none的区别

    其实这是一个老问题了,s visibility:hidden 与 display:none 共同点就是都会似的元素不可见.但是 visibility:hidden 的DOM元素是占用空间的,会挤占其他 ...

  10. 微信公众号jssdk自定义分享，二次分享自定义失败解决技巧

    百度上自定义微信分享标题以及描述的解决方法有很多,基本上都能实现一次分享:流程基本上是这样的 1.首先引入微信jssdk =><script src="http://res.wx ...