Ajax 学习笔记 (一)

  Ajax : 2005年,Jesse James Garrett发表了一篇在线文章,而就是这篇文章,开启了Ajax的新时代,其实在很早之前,就有人在使用这种技术了,但是这种技术在当时叫做远程脚本,但是一直没有一个很好的发展,在2005年之后,ajax就得到了很好的发展,这种浏览器与服务器的通讯技术在当时直到现在也是一个web开发者应该具备的基本知识。

  实际上Ajax 技术的核心是 XMLHttpRequest 对象(简称为 XHR),它是由微软首先引入的一个特性,其他浏览器厂商后来都提供了相同的实现。

  好了,背景知识就介绍到这里了,现在开始正题,让我们来学习一下传说中的Ajax吧:

  先来一小段代码:

  

  

  上面的代码有两部分,同步请求,和异步请求,一般来说,都同步会用的很少,所以说一下异步请求:

  首先要明确一个概念,到底什么是异步?其实我之前很难理解这个异步到底是怎么回事,知道后来试着开发小程序的时候,微信给的API当中的request请求,我才逐渐明白了异步与同步的概念了。

  所谓异步,就是在代码执行的阶段不去等待某一个事件返回结果,就直接执行下面的代码,在作用域内,全部代码执行完毕,在返回这个事件的结果,同步就不说了,应该看字面意思就会明白吧。

  回到正题

  XMLHttpRequest 对象,作为Ajax和核心,在如今的主流浏览器里面都支持它,(IE就不说它了,毕竟它确实是很有个性)

  创建XHR对象就要用到XMLHttpRequest的构造函数

  let xhr = new XMLHttpRequest();

  实现一个完整的Ajax的基本步骤:

    1、创建XHR对象

    2、调用open()方法,三个参数分别为,要发送请求的类型,请求的URL ,是否异步的布尔值

    3、调用send()方法,作为请求主体发送的数据,如果不需要就必须传入null,如果不传入null,在有些浏览器里会报错

  在异步的情况下,可以检测XHR对象的 readyState属性,该属性表示请求或者响应的当前活动阶段,它有五个值,分别为0,1,2,3,4。一般我们只用到4,它表示已经接受到全部的响应数据了。只要readyState属性值有变化,都会触发一次readystatechange事件,可以利用这个事件来检测每次状态变化后的readyState值。

  不过值得注意的一点是,onreadystatechange() 必须在调用open()之前指定它的事件处理程序,因为这样才能确保跨浏览器的兼容性。

  

  好了,今天就到这里了,基本的AJAX方法已经说完了,接下来还得继续深入学习。

猜你喜欢

转载自www.cnblogs.com/evenGO/p/9236270.html