/* 用XMLHTTPRequest来进行ajax异步数据交交互*/

主要有几个步骤:

//1.创建XMLHTTPRequest对象

//最复杂的一步

if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
//针对某些特定版本的mozillar浏览器的bug进行修正。
if (xmlhttp.overrideMimeType) {
xmlhttp.overrideMimeType('text/xml');
};
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

2.注册回调函数

xmlhttp.onreadystatechange = callback;

//3.设置连接信息。
//open第一个参数链接方式,第二是url地址
//3,true是异步链接
//xmlhttp.open("GET","xhr.php?name=" + username,true);

//使用post方式发送数据
xmlhttp.open("POST","xhr.php",true);

//post需要自己设置http的请求头
xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

//4,发送数据,开始和服务器进行交互
//中如果true, send这句话会立即执行
//如果是false(同步),send会在服务器数据回来才执行
//xmlhttp.send(null);
//因为是get所以send中不需要内容
xmlhttp.send('name=' +username);

}
//5.写回调函数,不同相应状态进行处理

function callback(){
alert(xmlhttp.readyState);
//判断对象状态是交互完成,接收服务器返回的数据
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
//["dada","xiaoyin","liujie"]
//纯文本的数据
var responseText = xmlhttp.responseText;
var divNode = document.getElementById('result');
//6.将服务器的数据显示在客户端
divNode.innerHTML = responseText;
}
}

ajax的网上解析的更多相关文章

  1. ajax返回数据解析总结

    ajax即异步 JavaScript 和 XML(Asynchronous JavaScript and XML). 简短地说,在不重载整个网页的情况下,AJAX 通过后台加载数据,并在网页上进行显示 ...

  2. ajax的原理解析

    一.关于同步与异步的分析: 异步传输是面向字符的传输,它的单位是字符:而同步传输是面向比特的传输,它的单位是桢,它传输的时候要求接受方和发送方的时钟是保持一致的.而ajax就是采用的异步请求方式的. ...

  3. phpStudy4——前端页面使用Ajax请求并解析php返回的json数据

    项目需求: 在html页面显示所有用户列表信息. 需求分析: 1. html页面使用ajax向后端php请求用户数据 2. php脚本查询数据库,并将查询后的结果以json格式返回前端html页面 3 ...

  4. jQuery ajax 流程全解析

    实例解析java + jQuery + json工作过程(登录) 本文主要讲解在java环境下使用jQuery进行JSON数据传送的交互过程 参考根据作者的账务管理系统(个人版) 源码下载 讲解 一. ...

  5. ajax之深入解析(1)

    AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJ ...

  6. ajax请求原理及jquery $.ajax封装全解析

    .ajax原理: Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据,然后用javascript来操作DOM而更新页面.这其中最关键的一步就是从服务器获得 ...

  7. 转:jQuery Ajax 实例 全解析

    jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯. 废话少说,直接进入正题,我们先来看一些简单的方法,这些方法都是对 ...

  8. 【JavaScript】jQuery Ajax 实例 全解析

    jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯. 废话少说,直接进入正题,我们先来看一些简单的方法,这些方法都是对 ...

  9. jQuery Ajax 实例 全解析

     jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯. 废话少说,直接进入正题,我们先来看一些简单的方法,这些方法都是 ...

随机推荐

  1. SDOI2018:荣誉称号

    题解: https://files.cnblogs.com/files/clrs97/title-solution.pdf Code: #include<cstdio> #include& ...

  2. (71)Wangdao.com第十一天_JavaScript 数学对象 Math

    Math 对象 封装了数学相关的 属性和方法. 和其他对象不一样,Math 不是一个构造函数,所以不能 new 生成实例, 其所有属性和方法都必须在 Math 对象上调用. 静态属性 Math.PI ...

  3. linux 中数据库的常用操作

    1-连接数据库: mysql -h localhost -u jiangbiao -p xxxxx@xxx:~$ mysql -h localhost -u jiangbiao -p Enter pa ...

  4. 白盒测试实践-day01

    一.任务进展情况 了解本次测试的主要任务,进行小组分工. 二.存在的问题 由于最近比较忙,任务来不及做. 三.解决方法 坚持一下.

  5. 【Java算法學習】斐波那契數列問題-兔子產子經典問題

    /** * 用遞推算法求解斐波那契數列:Fn = Fn-2 +Fn-1; */ import java.util.*; public class Fibonacci { public static v ...

  6. 20175303 2018-2019-2 《Java程序设计》第8周学习总结

    20175303 2018-2019-2 <Java程序设计>第8周学习总结 教材学习内容总结 本周学习<Java程序设计>第十五章: 泛型: 泛型(Generics)的主要目 ...

  7. xmind使用

    按住alt可以使子主题线条拉长:

  8. [dev][crypto][strongswan] 有关strongswan的forward policy的源码分析

    一 默认情况下,我们使用strongswan建立了一个ipsec隧道之后,建立的policy如下: [root@D129 OUTPUT]# ip xfrm policy src dst dir pty ...

  9. python panda::dataframe常用操作

    1.条件查询: result = df.query("((a==1 and b=="x") or c/d < 3))" print result 2.遍历 ...

  10. Python3学习之路~7.2 类的特殊成员方法

    1. __doc__ 表示类的描述信息 class Dog(object): """ 这个类是描述狗这个对象的 """ def func(s ...