1.什么是Ajax

  • Ajax: Asynchronous javascript and xml (异步javascript和xml)。

  • ==Ajax并不是一种新技术,而是已有技术的集合。JavaScript是核心载体==。

  • Ajax优势:在不刷新页面的情况下,更新页面数据,提升用户体验。

  • ==Ajax就像一个小秘书==,能够实现异步工作。

2.ajax核心对象 --- XMLHttpRequest

  创建ZMLhttpRequest对象,兼容IE7之前和主流浏览器

  1. //创建XMLHttpRequest对象,兼容低版本IE和非IE浏览器
  2. function getXhr () {
  3. var xmlhttp;
  4.  
  5. if (window.XMLHttpRequest) {
  6. //IE7+ 和 非IE 中都有 XMLHttpRequest对象
  7. xmlhttp = new XMLHttpRequest();
  8. } else {
  9. //低版本IE浏览器 实例化方式
  10. xmlhttp = new ActiveXObject('Msxml2.XMLHTTP');
  11. }
  12.  
  13. return xmlhttp;
  14. }

3.核心方法

XMLHttpRequest对象有了,可以发送Ajax请求了.发送请求有两个方法:

open(var1,var2,var3):准备ajax请求

  1. var1: 请求方式 get/post
  2. var2: 请求的后端程序地址
  3. var3: 异步(true)/同步(false),可选参数,默认为true
  1. var: 分为两种情况。 如果是get请求,则填写null 如果是post请求,则填写要发送到后端的数据。

 ==发送ajax请求流程

  1) 创建XMLHttpRequest对象

  2) 调用open方法准备ajax请求

  3) 调用send方法发送ajax请求

4.接收后端响应结果

Ajax的整个过程有5个状态,对应readyState的5个值:0-4

  0: (Uninitialized) the send( ) method has not yet been invoked.

  1: (Loading) the send( ) method has been invoked, request in progress.

  2: (Loaded) the send( ) method has completed, entire response received.

  3: (Interactive) the response is being parsed.

  4: (Completed) the response has been parsed, is ready for harvesting.

  0 - (未初始化)还没有调用send()方法

  1 - (载入)已调用send()方法,正在发送请求

  2 - (载入完成)send()方法执行完成,已经接收到全部响应内容

  3 - (交互)正在解析响应内容

  4 - (完成)响应内容解析完成,可以在客户端调用了

5.核心事件 --- onreadystatechange

  1.  onreadystatechange事件: readyState的值每次发生变化都会触发该事件。   0-->1   1-->2   2-->3   3-->4 总共触发4

6.其他属性

  responseText; 以字符串形式接受后端程序的返回值.

Ajxax技术-1的更多相关文章

  1. 关于解决python线上问题的几种有效技术

    工作后好久没上博客园了,虽然不是很忙,但也没学生时代闲了.今天上博客园,发现好多的文章都是年终总结,想想是不是自己也应该总结下,不过现在还没想好,等想好了再写吧.今天写写自己在工作后用到的技术干货,争 ...

  2. SQL Server技术内幕笔记合集

    SQL Server技术内幕笔记合集 发这一篇文章主要是方便大家找到我的笔记入口,方便大家o(∩_∩)o Microsoft SQL Server 6.5 技术内幕 笔记http://www.cnbl ...

  3. 本人提供微软系.NET技术顾问服务,欢迎企业咨询!

    背景: 1:目前微软系.NET技术高端人才缺少. 2:企业很难直接招到高端技术人才. 3:本人提供.NET技术顾问,保障你的产品或项目在正确的技术方向. 技术顾问服务 硬服务项: 1:提供技术.决策. ...

  4. 分布式锁1 Java常用技术方案

    前言:       由于在平时的工作中,线上服务器是分布式多台部署的,经常会面临解决分布式场景下数据一致性的问题,那么就要利用分布式锁来解决这些问题.所以自己结合实际工作中的一些经验和网上看到的一些资 ...

  5. 【大型网站技术实践】初级篇:借助LVS+Keepalived实现负载均衡

    一.负载均衡:必不可少的基础手段 1.1 找更多的牛来拉车吧 当前大多数的互联网系统都使用了服务器集群技术,集群即将相同服务部署在多台服务器上构成一个集群整体对外提供服务,这些集群可以是Web应用服务 ...

  6. 探真无阻塞加载javascript脚本技术,我们会发现很多意想不到的秘密

    下面的图片是我使用firefox和chrome浏览百度首页时候记录的http请求 下面是firefox: 下面是chrome: 在浏览百度首页前我都将浏览器的缓存全部清理掉,让这个场景最接近第一次访问 ...

  7. 关于如何提高Web服务端并发效率的异步编程技术

    最近我研究技术的一个重点是java的多线程开发,在我早期学习java的时候,很多书上把java的多线程开发标榜为简单易用,这个简单易用是以C语言作为参照的,不过我也没有使用过C语言开发过多线程,我只知 ...

  8. 架构设计:远程调用服务架构设计及zookeeper技术详解(下篇)

    一.下篇开头的废话 终于开写下篇了,这也是我写远程调用框架的第三篇文章,前两篇都被博客园作为[编辑推荐]的文章,很兴奋哦,嘿嘿~~~~,本人是个很臭美的人,一定得要截图为证: 今天是2014年的第一天 ...

  9. Java数据库连接技术——JDBC

    大家好,今天我们学习了Java如何连接数据库.之前学过.net语言的数据库操作,感觉就是一通百通,大同小异. JDBC是Java数据库连接技术的简称,提供连接各种常用数据库的能力. JDBC API ...

随机推荐

  1. CSS高级特效(上)

    1.CSS Shapes CSS Shapes是一个新标准,旨在让Web设计者能使用各种形状. CSS Shapes包含两组新属性,一组用于设置影响盒子中内容的形状,另一组用于设置影响形状元素周边内容 ...

  2. JavaScript Number() 函数

    JavaScript Number() 函数 JavaScript 全局对象 定义和用法 Number() 函数把对象的值转换为数字. 语法 Number(object) 参数 描述 object 必 ...

  3. HttpClient 模拟用户操作

    首先模拟用户登录: /** * 模拟用户登录 * */ private void login() throws HttpException, IOException { PostMethod logi ...

  4. Java 方法的重载及引用数据类型(类)

    方法的重载 我们假设要在程序中实现一个对数字求和的方法,由于参与求和数字的个数和类型都不确定,因此要针对不同的情况去设计不同的方法. Java允许在一个类中定义多个名称相同的方法,但是参数的类型或个数 ...

  5. MySQL数据库——查询数据

    增加数据: insert into "表名" values( '字段'',字段'); 或insert into '表名'( '字段'',字段')  values( '字段'',字段 ...

  6. Webpack file-loader 和 url-loader

    二者最好只选择一个来进行对文件的打包,防止有冲突出现导致图片加载失败 如果相对不同大小的问题选择不同的loader,可以在url-loader的fallback属性指定不满足条件时的loader { ...

  7. 串口线接Linux设备U盘安装系统和直接安装设备接显示屏2种方式不同

    Firmware Bug]: TSC_DEADLINE disabled due to Errata; please update microcode to version: 0x22 (or lat ...

  8. 解析Class文件之创建InstanceKlass对象

    ClassFileParser::parseClassFile()方法会将解析Class文件的大部分结果保存到instanceKlass对象中.创建instanceKlass对象的代码如下: int ...

  9. 【算法•日更•第五十七期】快速傅里叶变换(FFT):从入门到放弃

    ▎一些用的上的东西 小编太菜了,很多东西都不会证明(主要是三角函数还没有学啊~~~). 附上链接https://blog.csdn.net/enjoy_pascal/article/details/8 ...

  10. Excel清除隐藏的引号或空格

    问题场景 导出到Excel的数据内容有时候被"暗中"添加了[引号]或[空格]等字符. 尤其还"隐藏"了,以至于相同的内容,数据格式都没有问题,不能进行函数操作, ...