/* 用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. 【C语言程序】输出前50个素数

    #include <stdio.h> #include <stdlib.h> int main(void) {  ;  ;  ){   ;   ;i<x;i++){    ...

  2. web测试注意点

    关于网页测试我们需要注意的地方有: 1.每次测试之前都需要代码更新.清理缓存,测试数据使用新数据. 2.各模块的信息归类是否正确.比如进入一级栏目或二级栏目的列表页,查看左侧栏目名称,右侧文章标题及内 ...

  3. angular.isArray()

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

  4. 【欧拉回路+最小生成树】SD开车@山东2018省队一轮集训day1

    目录 [欧拉回路+最小生成树]SD开车@山东2018省队一轮集训day1 PROBLEM 题目描述 输入 输出 样例输入 样例输出 提示 SOLUTION CODE [欧拉回路+最小生成树]SD开车@ ...

  5. [LeetCode] Binary Trees With Factors 带因子的二叉树

    Given an array of unique integers, each integer is strictly greater than 1. We make a binary tree us ...

  6. duilib 新增数据迁移界面

    xml界面配置: <?xml version="1.0" encoding="utf-8"?> <Window caption="0 ...

  7. iOS HTML特殊字符转译

    something about you Bye Bye è; un saluto ​ 我使用NSXMLParser,它是顺利,直到它找到èHTML实体.它要求foundCharacters:为“再见” ...

  8. composer相关使用

    #composer安装 curl -sS https://getcomposer.org/installer | php #如果该命令执行不了,通过其他方式下载install文件后再执行“php in ...

  9. echo 与 printf的区别与联系

    echo命令默认是带有换行符的. 如果想让echo命令去掉每一行后面的换行符 方法1; 如果确信自己的脚本程序只运行在bash上,可以使用如下语法来出去空格: echo -n "Is it ...

  10. Mysql查询报错:Illegal mix of collations (gbk_chinese_ci,IMPLICIT) and (utf8_general_ci,COERCIBLE) for operation '='

    使用sql别名关联查询的时候,由于字符集冲突导致该错误 解决方案,查询的时候强制转换字符集类型 case when column = '' then _gbk '' collate gbk_chine ...