AJAX学习

Posted 2020-10-03 The_shy

一、概述

　　ajax不是一种新的语言，它是异步的javascript和xml。传统的请求式网页在发送请求和页面响应是同步进行的，我们知道，B/S架构中在浏览器中跑的代码是javascript、html标签还有CSS样式文件等，我们的请求可以由javascript代码来写，服务器端的请求数据接受可以由xml来做（因为xml的优势就在于数据的传递，xml容易被解析），而ajax就是将传统的这一过程异步化，达到发出请求后不必刷新整个页面也可以得到响应，其实这一思想不仅可以用在B/S架构的程序设计中，在C/S架构同样适用。

 

二、为神马ajax能够实现异步

　　这是因为现在的浏览器支持一个对象：XMLHttpRequest，这个对象可以使于服务器通信（交换数据，即请求响应）的过程发生在后台，如此便避免整个页面被刷新，这里面的具体实现过程应该涉及到了多线程的知识，多线程开发的一个重要作用就是将部分工作放在后台进行以保证前台与用户打交道的程序的流畅性，想到这里，笔者便忍不住有一种想要去好好学习多线程开发的冲动，但是由于目前的开发工作还用不到，所以多线程的学习优先级先降低。多线程可以实现异步调用但不是实现异步调用的唯一方法，还有一种是通过DMA来实现。

 

　　创建XMLHttpRequest:

varble = new XMLHttpRequest

 　　而老版本的ie5、6并不支持该对象，所以应该这样声明变量

variable=new ActiveXObject("Microsoft.XMLHTTP");

　　这样便能对所有浏览器兼容

var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }

三、XMLHttpRequest的方法与属性

方法	描述
open(method,url,async)	规定请求的类型、URL 以及是否异步处理请求。 method：请求的类型；GET 或 POST url：文件在服务器上的位置 async：true（异步）或 false（同步）
send(string)	将请求发送到服务器。 string：仅用于 POST 请求

　　

方法	描述
setRequestHeader(header,value)	向请求添加 HTTP 头。 header: 规定头的名称 value: 规定头的值

服务器响应

如需获得来自服务器的响应，请使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。

属性	描述
responseText	获得字符串形式的响应数据。
responseXML	获得 XML 形式的响应数据。

属性	描述
onreadystatechange	存储函数（或函数名），每当 readyState 属性改变时，就会调用该函数。
readyState	存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。 0: 请求未初始化 1: 服务器连接已建立 2: 请求已接收 3: 请求处理中 4: 请求已完成，且响应已就绪
status	200: "OK" 404: 未找到页面