<!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. 笔记-JDBC和commons-dbutils

    1.前言 玩过Java web的人应该都接触过JDBC,正是有了它,Java程序才能轻松地访问数据库.JDBC很多人都会,但是为什么我还要写它呢?我曾经一度用烂了JDBC,一度认为JDBC不过如此,后 ...

  2. 树莓派链接WiFi设置

    树莓派摆脱网线的束缚 在看这篇文章之前,请确保自己树莓派OS已经正常安装且已经连接网线,然后准备一个无线网卡,开始实现我们的树莓派摆脱网线的束缚吧 ! -_- 一.    安装网卡驱动 1.      ...

  3. Sequence one

    Problem Description Search is important in the acm algorithm. When you want to solve a problem by us ...

  4. 助你了解react的小demo

    React是个啥 React 是一个用于构建用户界面的 JAVASCRIPT 库. React主要用于构建UI,很多人认为 React 是 MVC 中的 V(视图). React 起源于 Facebo ...

  5. Ajax 跨域 异步 CORS

    HTTP access control (CORS) 核心在于使用定制(添加新的header)HTTP header让浏览器和服务器有更多的相互了解,从而决定一个请求或者响应成功还是失败   对于一个 ...

  6. Fiddler系列教程3:使用Fiddler录制Jmeter性能测试脚本

    今天继续给大家带来Fiddler工具的教程3:使用Fiddler录制Jmter性能测试脚本. 我们知道Jmeter本身可以录制脚本,也可以通过BadBoy,BlazeMeter等工具进行录制,其实Fi ...

  7. Could not load type 'System.ServiceModel.Activation.HttpModule' from assembly 'System.ServiceModel, Version=3.0.0.0,"解决办法

    这是因为先安装了 .NET Framework 4,随后启用了 .NET Framework 3.5 WCF HTTP 激活,则会发生此错误. 只需要已管理员用户在cmd中运行aspnet_regii ...

  8. 使用java生成mapbox-gl可读的vector tile

    概述 mapbox-gl主要数据源来自mapbox vector tile,本文就是要阐述怎样把postgresql中的地理空间数据转换成vector tile,流程图如下: 配置 该工程采用spri ...

  9. 运维必须掌握的150个Linux命令

    线上查询及帮助命令(1个)man 目录操作命令(6个)ls tree pwd mkdir rmdir cd 文件操作命令(7个)touch cp mv rm ln find rename 文件查看及处 ...

  10. Java设计模式相关面试

    1.接口是什么?为什么要使用接口而不是直接使用具体类? 接口用于定义 API.它定义了类必须得遵循的规则.同时,它提供了一种抽象,因为客户端只使用接口,这样可以有多重实现,如 List 接口,你可以使 ...