Ajax的异步交互:

  客户端向服务器端发送请求,直到服务器端进行响应,这个过程中,用户可以做任何其他事情(不等).

实现Ajax的异步交互步骤(举例说明):

  get方式:

  1.创建XMLHttpRequest核心对象

  

  var xhr=getXhr();

  2. 与服务器端建立连接

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

  3. 客户端向服务器端发送请求

  //send()方法不起作用,但是不能被省略

  xhr.send(null);

  4. 客户端接收服务器端的响应
    xhr.onreadystatechange = function()

  {       

    if(xhr.readyState == 4 && xhr.status == 200)

    {         

      var data = xhr.responseText;         

      console.log(data);       

    }
   }

   post方式

  1.创建XMLHttpRequest核心对象

  

  2. 与服务器端建立连接

  xhr.open("post","01.php");

  3. 客户端向服务器端发送请求

  //send()方法起作用
     //在send()方法被调用前,使用setRequestHeader()方法设置请求头信息

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

 xhr.send("user=zhangwuji");

  4. 客户端接收服务器端的响应

  xhr.onreadystatechange = function()

  {       

    if(xhr.readyState == 4 && xhr.status == 200)

    {
        var data = xhr.responseText;
        console.log(data);
      }

   }

  

  

ajax_异步交互-get/post方式的更多相关文章

  1. AsyncTask异步交互和httpurlconnection结合使用

    //网络请求数据 package com.baidu.myutils; import java.io.BufferedReader; import java.io.InputStreamReader; ...

  2. AJAX 异步交互基本总结

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

  3. Ajax异步交互基础

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

  4. struts2实现jQuery的异步交互

    struts2中jQuery的异步交互有两种方式: 1)是利用构造字符串的方式来实现: 使用该方法主要是在服务器端根据前端的请求,返回一个字符串信息,然后前端的jQuery通过解析该字符串信息得到对应 ...

  5. struts2实现XML异步交互

    异步交互,在不用重新提交整个页面的情况下可以实现页面局部信息与服务器的交互.在编写异步交互时需要用到一个架包:dom4j,下载地址为:https://dom4j.github.io/ 下面通过例子说明 ...

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

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

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

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

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

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

  9. Angular2+ 实现组件交互的众多方式

    实现组件交互有很多方式,下面列举. 1.父组件向子组件传递数据:(属性绑定) 父组件 [子属性名] = "父属性名" <child-content [data]=" ...

随机推荐

  1. javascript将异步校验表单改写为同步表单

    同步表单校验的缺点 响应错误信息时,需要重新加载整个页面(虽然有缓存,客户端仍然需要通过http协议对比每个文件是否有更新,以保持文件最新) 服务器响应错误以后,用户之前所输入的信息全部丢失了,用户需 ...

  2. RejexLib

    http://www.regexlib.com/ http://www.brics.dk/automaton/index.html http://code.google.com/p/automatap ...

  3. JEECMS用法总结

    1.循环打印栏目: [@cms_channel_list] [#list tag_list as c] <li id="${c.path}"><a href=&q ...

  4. 接着上一个版本在上一个分离access-token和ticket的版本

    上代码: 本次修改将获取token和ticket分离出来,分别封装在函数中: 每个函数最后一个参数是一个回调参数: 回调函数的参数,是这一步中需要处理的结果; 结果怎么处理,根据传递进去的函数: va ...

  5. zoj2729 Sum Up(模拟)

    Sum Up Time Limit: 2 Seconds      Memory Limit: 65536 KB Vivid has stored a piece of private informa ...

  6. js 使用for循环遍历数组

    今天写个无聊的东西!for循环的使用! 例如以下:定义a数组,b为伪数组! var a = [1,2,3,0,5,4]; var b = document.getElementsByTagName(' ...

  7. xcode xib 加载 、注意点

    加载xib2中方式 NSArray *array = [[NSBundle mainBundle] loadNibNamed:@"xib名称" owner:nil options: ...

  8. PS学习

    PS快捷键大全(转自UI中国PS教程) 摆脱鼠标流就靠这张图了!!!! 查看图像 使用导航器查看图像 选择窗口-->导航器 菜单命令 使用缩放工具查看图像 ctrl++ 以画布大小放大图像 ct ...

  9. Javascript/Jquery 中each() 和forEach()的区别

    从名字看上去这两个方法好像有点关系,但在javascript中它们区别还是挺大的. forEach() 用于数组的操作,对数组中的每个元素执行制定的函数(不是数组不能使用forEach()方法). 而 ...

  10. English - allow to do 与 allow doing 的区别

    英语中并没有allow to do sth这种结构,只有allow doing sth 及allow sb to do sth这两个结构. 你这样记忆可能方便一些: 1. 在主动语态中,如果allow ...