<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>xml</title>
</head>
<body>
	<div id="div"></div>

	<button id="person">加载信息</button>

	<script type="text/javascript">
		//声明全局XMLHttpRequest对象
		var myXmlHttpRequest;
		if(window.XMLHttpRequest){
			myXmlHttpRequest = new XMLHttpRequest();
		}else{
			myXmlHttpRequest = new ActiveObject("Microsoft.XMLHTTP");
		}

		var numb = 0;

		document.getElementById("person").onclick = function(){
			var url="/app/json/a.json";
			/*
				O 表示未发送，open()函数还没执行。
				1 表示已发送，send()函数还没执行。
				2 send函数已执行，头部和状态吗都可以获取了。
				3 头部已收到，但响应体在解析中。
				4 表示请求已完成，包括响应头和响应体的内容已经接收到了。
				客户端跨域的XMLHttpRequest需要服务端的支持来保证JSON资源请求成功。
				服务器端在响应头加上带有Access-Control-Allow前缀的属性为跨域资源共享提供支持。
				CORS（Cross-Origin Resource Sharing）使得跨域资源共享的同时还可以禁止某些域名访问。
			*/
			myXmlHttpRequest.onreadystatechange = function(){
				if(myXmlHttpRequest.readyState===4&&myXmlHttpRequest.status===200){
					var myObject = JSON.parse(myXmlHttpRequest.responseText);
					var myJSON = JSON.stringify(myObject);
					var div = document.getElementById("div");
					div.innerHTML = myJSON;
				}
			}

			console.log("走了"+(++numb));
			myXmlHttpRequest.open("GET",url,true);
			myXmlHttpRequest.send();

		}
	</script>
</body>
</html>

使用XMLHttpRequest异步通信的更多相关文章

  1. Ajax 与 XmlHttpRequest

    AJAX描述了确保Web应用在Web服务器请求新数据的情况下也能(几乎)实时反应的一种方法.具体地说,AJAX只是一些建立已久的技术的相互作用,从HTML.XHTML和HTTP,到JavaScript ...

  2. 原生javaScript中使用Ajax实现异步通信

    AJAX本质就是在HTTP协议的基础上以异步的方式与服务器进行通信,所谓异步,就是指某段程序执行时不会阻塞其它程序执行,其表现形式为程序的执行顺序不依赖程序本身的书写顺序,相反则为同步. 以下开始简单 ...

  3. script ajax / XHR / XMLHttpRequest

    s 利用XHR 调试发送form data表单数据,F5键刷新form表单URL ,http请求地址,获取token,提交. 如:http://pcp.cns*****.com/spcp-web/vm ...

  4. 第108天：Ajax中XMLHttpRequest详解

    在Ajax应用程序中,XmlHttpRequest对象负责将用户信息以异步通信地发送到服务器端,并接收服务器返回的响应信息和数据. XMLHttpRequest可以提供不重新加载页面的情况下更新网页, ...

  5. AJAX——XMLHttpRequest对象的使用

    AJAX是web2.0即动态网页的基础,而XMLHttpRequest对象又是AJAX的核心.XMLHttpRequest对象负责将用户信息以异步通信地发送到服务器端,并接收服务器响应信息和数据 一. ...

  6. 【Ajax 2】封装Ajax的核心对象：XMLHttpRequest对象

    导读:AJAX利用一个构建到所有现代浏览器内部的对象-XMLHttpRequest-来实现发送和接收HTTP请求与响应信息.那么,XMLHttpRequest对象是怎么创建和封装的呢? 一.简介 1. ...

  7. ajax——XMLHttpRequest

    XMLHttpRequest对象.能够让ajax程序在不又一次载入的页面的情况下更新页面数据,页面载入完毕后从server接受发生数据.这样既减轻了server负担又回顾了响应速度,缩短了用户的等待时 ...

  8. 本机Ajax异步通信

    昨天我们用JQuery.Ajax解释JQuery样通过Ajax实现异步通信.为了更好的编织知识网,今天我们用一个Demo演示怎样用javascript实现原生Ajax的异步通信. 原生Ajax实现异步 ...

  9. JavaScript:学习笔记(10)——XMLHttpRequest对象

    JavaScript:学习笔记(10)——XMLHttpRequest对象 XHR对象 使用XMLHttpRequest (XHR)对象可以与服务器交互.您可以从URL获取数据,而无需让整个的页面刷新 ...

随机推荐

  1. CJOJ 2044 【一本通】最长公共子序列（动态规划）

    CJOJ 2044 [一本通]最长公共子序列(动态规划) Description 一个给定序列的子序列是在该序列中删去若干元素后得到的序列.确切地说,若给定序列X,则另一序列Z是X的子序列是指存在一个 ...

  2. HashTable的故事----Jdk源码解读

    HashTable的故事 很早之前,在讲HashMap的时候,我们就说过hash是散列,把...弄碎的意思.hashtable中的hash也是这个意思,而table呢,是指数据表格,也就是说hasht ...

  3. PHP闭包和高阶函数

    <?php function func($a, $b) { $line = function ($x) use ($a, $b) { return $a*$x + $b; }; return $ ...

  4. STK卫星工具箱下载

    简介 STK的全称是Satellite Tool Kit(卫星工具箱),STK/Pro 9.0最新出品,完整版,是由Analytical Graphics公司开发的一款在航天工业领域中处于绝对领先地位 ...

  5. python3之微信文章爬虫

    前提: python3.4 windows 作用:通过搜狗的微信搜索接口http://weixin.sogou.com/来搜索相关微信文章,并将标题及相关链接导入Excel表格中 说明:需xlsxwr ...

  6. CentOS安装配置MySql数据库

    CentOS版本7.2,MySql版本5.7 1.下载MySql安装源     wget https://dev.mysql.com/get/mysql57-community-release-el7 ...

  7. RabbitMQ入门-初识RabbitMQ

    初识RabbitMQ 要说RabbitMQ,我们不得不先说下AMQP.AMQP,即Advanced Message Queuing Protocol,高级消息队列协议,是应用层协议的一个开放标准,为面 ...

  8. Mybatis框架分析

    摘要 本篇文章只是个人阅读mybatis源码总结的经验或者个人理解mybatis的基本轮廓,作为抛砖引玉的功能,希望对你有帮助,如果需要深入了解细节还需亲自去阅读源码. mybatis基本架构 myb ...

  9. Redis架构设计--客户端请求RedisServer时，server端持久化的部分操作

  10. rpm体系下的linux安装httpd+mysql+…

    一.安装apache 在rpm体系下,apache称为httpd. yum install httpd 即可! 二.安装mysql yum install mysql 三.安装mysql-server ...