AjAX 异步通信
<!DOCTYPE html>
<html lang="en">
<head>
<title>xmlhttprequest ajax demo</title>
<script type ="text/javascript" language ="javascript" >
var req; //定义变量，用来创建xmlhttprequest对象
function creatReq() // 创建xmlhttprequest,ajax开始
{
var url="./test4.json"; //要请求的服务端地址
if(window.XMLHttpRequest) //非IE浏览器及IE7(7.0及以上版本)，用xmlhttprequest对象创建
{
req=new XMLHttpRequest();
}
else if(window.ActiveXObject) //IE(6.0及以下版本)浏览器用activexobject对象创建,如果用户浏览器禁用了ActiveX,可能会失败.
{
req=new ActiveXObject("Microsoft.XMLHttp");
} if(req) //成功创建xmlhttprequest
{
req.open("GET",url,true); //与服务端建立连接(请求方式post或get，地址,true表示异步)
req.onreadystatechange = callback; //指定回调函数
req.send(null); //发送请求
}
} function callback() //回调函数，对服务端的响应处理，监视response状态
{
console.log(req);
if(req.readyState==4) //请求状态为4表示成功
{
if(req.status==200) //http状态200表示OK
{
Dispaly(); //所有状态成功，执行此函数，显示数据
}
else //http返回状态失败
{
alert("服务端返回状态" + req.statusText);
}
}
else //请求状态还没有成功，页面等待
{
document .getElementById ("myTime").innerHTML ="数据加载中";
}
} function Dispaly() //接受服务端返回的数据，对其进行显示
{
document .getElementById ("myTime").innerHTML =(req.responseText);
} </script>
</head>
<body>
<div id="myTime"></div> <input id="Button1" type="button" value="Get Time" onclick ="creatReq();"/>
</body>
</html>
注意事项：
1首先创建XMLHttpRequest对象。为了兼容IE6浏览器。
if(window.XMLHttpRequest) //非IE浏览器及IE7(7.0及以上版本)，用xmlhttprequest对象创建
{
req=new XMLHttpRequest();
}
else if(window.ActiveXObject) //IE(6.0及以下版本)浏览器用activexobject对象创建,如果用户浏览器禁用了ActiveX,可能会失败.
{
req=new ActiveXObject("Microsoft.XMLHttp");
} 2.创建好了对象后，发送之前，还需要设置一下请求信息，即open('GET',url,false)这三个参数，第一个参数表示的是请求方法，第二个参数表示是请求的网址，第三个参数是一个boolean值，true表示异步操作，false表示的是同步操作。
3.设置好了请求信息后，就可以发送了，即send（null），对于get请求方式，不需要发送附加信息，所以可以设置null。
4. req.onreadystatechange = callback; //指定回调函数
这个是监听后台状态，然后做出相应的响应。
AjAX 异步通信的更多相关文章
- 本机Ajax异步通信
昨天我们用JQuery.Ajax解释JQuery样通过Ajax实现异步通信.为了更好的编织知识网,今天我们用一个Demo演示怎样用javascript实现原生Ajax的异步通信. 原生Ajax实现异步 ...
- struts2，实现Ajax异步通信
用例需要依赖的jar: struts2-core.jar struts2-convention-plugin.jar,非必须 org.codehaus.jackson.jar,提供json支持 用例代 ...
- 原生javaScript中使用Ajax实现异步通信
AJAX本质就是在HTTP协议的基础上以异步的方式与服务器进行通信,所谓异步,就是指某段程序执行时不会阻塞其它程序执行,其表现形式为程序的执行顺序不依赖程序本身的书写顺序,相反则为同步. 以下开始简单 ...
- 网站教学 提纲总结到ajax结束后面还有
Repeater - 重复器五个模板:HeaderTemplate - 在最上面,显示一次FooterTemplate - 最下面,显示一次ItemTemplate - 在中间,显示n次Alterna ...
- 什么是 ajax？----异步 javascript 和 xml
GET 用于请求服务器数据 POST 用于上传数据到服务器,或者修改服务器数据 ajax 异步通信,实现页面的局部刷新,按需获取数据,节约带宽,带来更好的用户体验 客户端与服务器在不必刷新浏览器的情况 ...
- 6.Vue的Axios异步通信
1.什么是Axios Axios 是一个开源的可以用在浏览器端和 NodeJS 的异步通信框架,主要作用就是实现 AJAX 异步通信,其功能特点如下: 从浏览器中创建 XMLHttpRequests ...
- Ajax 简述与基础语法
目录 Ajax 1. 原生 JS 实现 Ajax 2. 使用 Ajax 实现异步通信 a. Ajax 的基础语法 b. 用 Ajax 传递数据 i. 传递字符串数据 ii. 传递 JSON 数据 3. ...
- jQuery从无知到无所不知
说明: 本文以读书笔记的方式整理jQuery的重要知识点,言简意赅,一语中的,删繁就简,引人入胜. 本文先对jQuery强大的功能作一系统的介绍,再详细整理jQuery的选择器.过滤器.DOM操作.事 ...
- 25款顶级的jQuery表格插件
jQuery 表格插件可以让你创建各种各样的表格布局,表格布局是报纸和杂志中最常见的布局,现在的网站中也很常见,在这篇文章中,我向大家推荐25个jQuery 的表格插件,你可以任意控制表格的行和列,用 ...
随机推荐
- mod35云掩膜产品用法
在网上一直没找到一个明确说怎么用MOD35产品的,都是说去看用户手册,第一次看了过一段时间我又忘记怎么搞了,赶紧记下来. 而且现在才发现第一次自己搞的都弄错了. 简单的判断是否是云,只要读取mod35 ...
- intelliJ 社区版-找不到 plugins选项
丢人了... 今天 在intelliJ社区版上面找不到 plugins 选项了, 其实是有的,我看的是项目的 settings 当然没有了, (1)如果直接点击File==> 这样就是没有plu ...
- netcore与ef资料收集
http://www.cnblogs.com/cgzl/p/7661805.html https://www.cnblogs.com/cgzl/p/7675485.html https://www.c ...
- 在Visual Studio中新增生成项目
在Visual Studio中新增生成项目 选择适配器类型 选择WCF-SQL适配器 创建连接选项 选择相应的存储过程 生成相应的消息架构
- （十三）golang--程序流程控制
1.顺序控制 若没有判断,没有跳转,程序由上至下依次执行 2.分支控制 单分支if 条件表达式 { 执行代码块} 双分支if 条件表达式 { 执行代码块1} else { 执行代码块2} 多分支if ...
- SpringBoot+EventBus使用教程（一）
一.简介 EventBus是一个基于发布订阅的事件总线,在Java和Android里都可以使用. 二.使用 1.引入pom <dependency> <groupId>org. ...
- 深入理解C语言 - 指针详解
一.什么是指针 C语言里,变量存放在内存中,而内存其实就是一组有序字节组成的数组,每个字节有唯一的内存地址.CPU 通过内存寻址对存储在内存中的某个指定数据对象的地址进行定位.这里,数据对象是指存储在 ...
- SQL-----数据库三种删除方式详解
第一种 使用delete 语句 特点: delete 属于数据库操纵语言DML,表示删除表中的数据, 删除过程是每次从表中删除一行,并把该行删除操作作为事务记录在日志中保存 可以配合事件(tran ...
- WindowsServer --------- 在服务器中安装sqlserver 数据库
数据库文件可能比较大可以通过盘符映射来进行传递,就是时间比较慢 方法,上一片就是介绍如何进行传递 点击这个连接 安装sqlserver 2014 数据库 要是没有密钥可以试试这个 一般 .Ne ...
- 【转】用VMware 8安装Ubuntu 12.04详细过程（图解）
图解演示环境版本: 本机系统: WIN7 虚拟机:VMware Workstation 8 (英文版) 安装目标:Ubuntu Desktop 12.04 LTS (请点击这里)先下载好iso镜像文 ...