<input type="button" value="异步请求"id="btn">

<script>

实现ajax的异步交互的步骤

var btn document.getElementById("btn”);

btn.onclick=function(){

//创建XMLHttpRequest对象

var xhr=getXhr();

/*与服务器建立连接*/

xhr.open("get","01.php?"user=zhangwuji");

//客户端向服务器端发送请求

xhr.send(null);

//客户单接受服务器端的响应

xhr.onreadystatechange=function(){

if(xhr.readyState=4){

if(xhr.status=200){

var data=xhr.responseText;

console.log(data);

}

}

}

//定义创建xmlHttp对象的函数

function getXhr(){

var xhr=null;

if(window.XMLHttpRequest){

xhr=new XMLHttpRequest();

}else{

xhr=ActiveXObject("Microsoft.XMLHttp");

}

return xhr;

</script>

实现AJAX的异步交互的步骤的更多相关文章

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

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

  2. 原生Ajax实现异步交互

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

  3. AJAX 异步交互基本总结

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

  4. ajax_异步交互-get/post方式

    Ajax的异步交互: 客户端向服务器端发送请求,直到服务器端进行响应,这个过程中,用户可以做任何其他事情(不等). 实现Ajax的异步交互步骤(举例说明): get方式: 1.创建XMLHttpReq ...

  5. Ajax简单介绍和使用步骤

    Ajax被认为是(Asynchronous(异步) JavaScript And Xml的缩写).现在,允许浏览器与服务器通信而无须刷新当前页面的技术都被叫做Ajax. 同步是指:发送方发出数据后,等 ...

  6. Ajax异步交互基础

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

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

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

  8. ajax实现异步前后台交互,模拟百度搜索框智能提示

    1.什么是异步?在传统的网站项目中,填写一堆数据,最后点击提交,在点击提交的这一刻才实现数据提交,前后台交互.在你点击提交之前数据是没有提交到后台的.这样就会造成很大的不便.比如,我填了一大堆数据,结 ...

  9. Ajax异步交互 [异步对象连接服务器]

    <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>X ...

随机推荐

  1. 锤子手机 Smartisan M1L 咖啡金 真皮背面 高配版 5.7

    http://www.smartisan.com/m1/#/os    快人一步的OS http://www.smartisan.com/shop/#/buyphone?c=coffee&v= ...

  2. Get the current user permission level on a list item with ecmascript 分类: Sharepoint 2015-07-14 14:13 7人阅读 评论(0) 收藏

    To Check current users permissions using Ecmascript\Javascript client object model SharePoint 2010. ...

  3. android 测试 Monkey 和 MonkeyRunner 的使用

    一.Monkey的使用 Monkey使用起来比较简单,简而言之就是模拟手机点击效果,随机发送N个点击动作给手机,主要对于程序的稳定和承受压力的测试. 1.首先连接上你的手机或者启动模拟器: 2.运行C ...

  4. javafx之HTTP协议交互

    javafx端要获取获取如下信息: 服务器端获取的数据: javafx客户端发送的数据以及获取的数据: 工程目录: package Httputil; import IPsite.IPaddress; ...

  5. http状态消息

    1-5状态码了解 1XX 表示信息(消息) 2XX 表示成功 3XX 表示重定向 4XX 表示请求错误 *** 5XX 表示服务端错误 常见状态码 200 请求成功 一切正常 301 重定向,修改后的 ...

  6. java.io.IOException: Cannot run program "jad"

    今天调试google tag manager, 需要看看google analytics source code,无奈没有源码,装个一个插件ejad 还是不行: java.io.IOException ...

  7. ACM 字符串 题目整理

    AC自动机 UVa 11468  Substring AC自动机+概率DP. 注意要补全不存在的边. 为什么要补全不存在的边呢?补全以后可以直接找到状态的转移,即从所有子节点就可以实现所有状态转移. ...

  8. javascript学习之【new操作符】

    首先请大家思考这么一段代码,如下: <script>var jquery=function(){     console.log(this);};jquery();new jquery() ...

  9. (转)Web性能优化方案

    第一章 打开网站慢现状分析 在公司访问部署在IDC机房的VIP网站时会感觉很慢.是什么原因造成的?为了缩短页面的响应时间,改进我们的用户体验,我们需要知道用户的时间花在等待什么东西上. 可以跟踪一下我 ...

  10. Ionic2 rc2 Events 跨界面调用的使用方法及问题解决

    Events:事件注册  在任意一界面注册事件之后可在任意界面根据事件名称进行调用. 首先看一下官方文档的调用方式 import { Events } from 'ionic-angular'; co ...