Ajax的readyState和status属性
AJAX案例
div 部分用于显示来自服务器的信息。
当按钮被点击时，它负责调用名为loadXMLDoc() 的函数：<html><body><div id="myDiv"><h3>Let AJAX change this text</h3></div><button type="button" onclick="loadXMLDoc()">Change Content</button></body></html>接下来，在页面的 head 部分添加一个 <script> 标签。
该标签中包含了这个loadXMLDoc() 函数：<head><script type="text/javascript">function loadXMLDoc(){.... AJAX script goes here ...}</script></head>AJAX - 创建 XMLHttpRequest 对象∙Previous Page∙Next PageXMLHttpRequest 是 AJAX 的基础。
XMLHttpRequest 对象所有现代浏览器均支持 XMLHttpRequest 对象（IE5 和 IE6 使用ActiveXObject）。
XMLHttpRequest 用于在后台与服务器交换数据。
这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。
创建 XMLHttpRequest 对象所有现代浏览器（IE7+、Firefox、Chrome、Safari 以及 Opera）均内建XMLHttpRequest 对象。
创建 XMLHttpRequest 对象的语法：variable=new XMLHttpRequest();老版本的 Internet Explorer （IE5 和 IE6）使用 ActiveX 对象：variable=new ActiveXObject("Microsoft.XMLHTTP");为了应对所有的现代浏览器，包括 IE5 和 IE6，请检查浏览器是否支持XMLHttpRequest 对象。
Ajax技术考试题目
AJax笔试题目1. 以下（ A,C ）是针对XML文档的定义和规范。
【选两项】A. DTDB. SGMLC. SchemaD. complexType2. 关于XML的语法规则，下列说法中错误的有（ C,D ）。
【选两项】A.XML文档必须有且只能有一个根元素B.XML文档中的标签（元素）区分大小写C.XML文档中的元素和属性都必须加引号D.XML文档中一个属性可以包含多个值3. 以下选项中，XML元素中的子元素转换成属性表示正确的是（ A ）。
<书桌><长>1100mm</长><宽>600mm</宽><高>710mm</高></书桌>A.<书桌长="1100mm" 宽="600mm" 高="710mm"></书桌>B.<书桌长="600mm" 宽="710mm" 高="1100mm"></书桌>C.<书桌长="700mm" 宽="600mm" 高="1100mm"></书桌>D.以上都不正确4. 关于XML Schema相比DTD的优势，以下说法错误的是（ D ）。
A.Schema可以更容易地描述文档内容B.Schema可以更容易地与来自数据库的数据一起工作C.Schema可以更容易地定义数据约束D.Schema更容易嵌入到XML文档中进行验证5. 关于DOM级别，下列说法中正确的有（ A,B ）。
【选两项】A.DOM级别是W3C组织的DOM规范B.DOM级别1专注于文档模型C.DOM级别2专注于文档模型D.DOM级别2规定了DTD和Schema6. 关于XML节点树，下列描述错误的是（ D ）。
一、Django前后端交互之Ajax和跨域问题
⼀、Django前后端交互之Ajax和跨域问题⼀、Ajax介绍1、概述AJAX 是⼀种在⽆需重新加载整个⽹页的情况下，能够更新部分⽹页的技术。
AJAX（Asynchronous Javascript And XML）翻译成中⽂就是“异步Javascript和XML”。
即：使⽤Javascript语⾔与服务器进⾏异步交互，传输的数据为XML（当然，传输的数据不只是XML，⽐如还有JSON）。
同步交互：客户端发出⼀个请求后，需要等待服务器响应结束后，才能发出第⼆个请求；异步交互：客户端发出⼀个请求后，⽆需等待服务器响应结束，就可以发出第⼆个请求。
2、使⽤场景搜索引擎（⾕歌、百度）在⽤户输⼊某个关键字后，会出来⼀串提⽰关键字；注册页⾯，输⼊信息后，如果信息有重复或缺失，会⾃动提⽰；当我们只要修改⽹页上的部分内容时，单独局部刷新就可以做到；3、优缺点优点：AJAX使⽤Javascript技术向服务器发送异步请求；AJAX⽆须刷新整个页⾯；因为服务器响应内容不再是整个页⾯，⽽是页⾯中的局部，所以AJAX性能⾼；缺点：AJAX并不适合所有场景，很多时候还是要使⽤同步交互；AJAX虽然提⾼了⽤户体验，但⽆形中向服务器发送的请求次数增多了，导致服务器压⼒增⼤；因为AJAX是在浏览器中使⽤Javascript技术完成的，所以还需要处理浏览器兼容性问题，当然，如果使⽤jQuery的话，则不⽤考虑这个问题；⼆、通过JavaScript实现Ajax1、过程和请求相关使⽤Ajax的过程：创建核⼼对象，根据不同浏览器版本新建核⼼对象（主要原因是浏览器兼容问题）；使⽤核⼼对象打开与服务器的连接（open⽅法）；发送请求（send⽅法）注册监听，监听服务器响应。
（通过判断核⼼对象的就绪程度和状态码）XMLHTTPRequest关键知识点：open(请求⽅式, URL, 是否异步)send(请求体)onreadystatechange，指定监听函数，它会在xmlHttp对象的状态发⽣变化时被调⽤readyState，当前xmlHttp对象的状态，其中4状态表⽰服务器响应结束status：服务器响应的状态码，只有服务器响应结束时才有这个东东，200表⽰响应成功；responseText：获取服务器的响应体，⽂本responseXML：获取服务器的响应体，XML2、通过JavaScript实现Ajax之⽆后台交互<html><head><script type="text/javascript">function loadXMLDoc(){var xmlhttp;if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safarixmlhttp=new XMLHttpRequest();}else{// code for IE6, IE5xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}xmlhttp.onreadystatechange=function(){if (xmlhttp.readyState==4 && xmlhttp.status==200){document.getElementById("myDiv").innerHTML=xmlhttp.responseText;}}xmlhttp.open("GET","/ajax/test1.txt",true);xmlhttp.send();}</script></head><body><div id="myDiv"><h2>Let AJAX change this text</h2></div><button type="button" onclick="loadXMLDoc()">通过 AJAX 改变内容</button></body></html>3、通过JavaScript实现Ajax之与后台交互通过Django实现，其实唯⼀区别就是在open的时候，把URL修改成Django的⼀个URL即可，包括GET和POST⽅法的URL。
详解ajax跨域问题解决方案
详解ajax跨域问题解决⽅案今天来记录⼀下关于ajax跨域的⼀些问题。
以备不时之需。
跨域同源策略限制同源策略阻⽌从⼀个域上加载的脚本获取或操作另⼀个域上的⽂档属性。
也就是说，受到请求的 URL 的域必须与当前 Web页⾯的域相同。
这意味着浏览器隔离来⾃不同源的内容，以防⽌它们之间的操作。
解决⽅式通常来说，⽐较通⽤的有如下两种⽅式，⼀种是从服务器端下⼿，另⼀种则是从客户端的⾓度出发。
⼆者各有利弊，具体要使⽤哪种⽅式还需要具体的分析。
1. 服务器设置响应头2. 服务器代理3. 客户端采⽤脚本回调机制。
⽅式⼀Access-Control-Allow-Origin 关键字只有在服务器端进⾏设置才会⽣效。
也就是说即使再客户端使⽤xmlhttprequest.setHeaderREquest('xx','xx');也不会有什么效果。
正常ajax请求下⾯来模拟⼀下ajax⾮跨域请求的案例实现。
test1.html<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>ajax 测试</title></head><body><input type="button" value="Test" onclick="crossDomainRequest()"><div id="content"></div><script>var xhr = new XMLHttpRequest();var url = 'http://localhost/learn/ajax/test1.php';function crossDomainRequest() {document.getElementById('content').innerHTML = "<font color='red'>loading...</font>";// 延迟执⾏setTimeout(function () {if (xhr) {xhr.open('GEt', url, true);xhr.onreadystatechange = handle_response;xhr.send(null);} else {document.getElementById('content').innerText = "不能创建XMLHttpRequest对象";}}, 3000);}function handle_response() {var container = document.getElementById('content');if (xhr.readyState == 4) {if (xhr.status == 200 || xhr.status == 304) {container.innerHTML = xhr.responseText;} else {container.innerText = '不能跨域请求';}}}</script></body></html>同级⽬录下的test1.PHP内容如下：<?phpecho "It Works.";>跨域请求刚才是HTML⽂件和php⽂件都在Apache的容器下，所以没有出现跨域的情形，现在把HTML⽂件放到桌⾯上，这样再次请求PHP数据的话，就营造了这样⼀个“跨域请求”了。
Ajax中的XMLHttpRequest对象详解
Ajax中的XMLHttpRequest对象详解XMLHttpRequest对象是Ajax技术的核⼼。
在Internet Explorer 5中，XMLHttpRequest对象以ActiveX对象引⼊，被称之为XMLHTTP，它是⼀种⽀持异步请求的技术。
后来Mozilla、Netscape、Safari、Firefox和其他浏览器也提供了XMLHttpRequest类，虽然这些浏览器都提供了XMLHttpRequest类，但它们创建XMLHttpRequest类的⽅法并不相同。
XMLHttpRequest使我们可以使⽤JavaScript向服务器提出请求并处理响应，⽽不阻塞⽤户的其他操作。
不刷新页⾯就和服务器进⾏交互是Ajax最⼤的特点。
这个重要的特点主要归功于XMLHttpRequest对象。
使⽤XMLHttpRequest对象使得⽹页应⽤程序像windows应⽤程序⼀样，能够及时响应⽤户与服务器之间的交互，不必进⾏页⾯刷新或者跳转，并且能够进⾏⼀系列的数据处理，这些功能可以使⽤户的等待时间缩短，同时也减轻了服务器端的负载。
⽬前XMLHttpRequest对象已经得到了⼤部分浏览器的⽀持，因此使⽤Ajax技术开发Web应⽤程序的时候⼀般情况下不会出现问题。
不过，当开发⼈员确定使⽤Ajax技术来开发时，仍然需要考虑⽤户会使⽤什么样的浏览器来对⽹站进⾏访问，虽然不⽀持XMLHttpRequest对象的浏览器占少数。
在使⽤XMLHttpRequest对象向服务器发送请求和处理响应之前，必修先⽤JavaScript创建⼀个XMLHttpRequest对象，然后通过这个对象来和服务器建⽴请求并接收服务器返回的数据。
由于XMLHttpRequest不是⼀个W3C标准，所以可以采⽤多种⽅法使⽤JavaScript来创建XMLHttpRequest的实例。
Internet Explorer把XMLHttpRequest实现为⼀个ActiveX对象，其他浏览器（如Firefox、Safari和Opera等）把它实现为⼀个本地JavaScript对象。
readyState的五种状态详解
readyState的五种状态详解2007年07月16日原创, 翻译在《Pragmatic Ajax A Web 2.0 Primer 》中偶然看到对readyStae状态的介绍，感觉这个介绍很实在，摘译如下：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 －（完成）响应内容解析完成，可以在客户端调用了对于readyState的这五种状态，其他书中大都语焉不详。
像《Foundations of Ajax》中，只在书中的表2-2简单地列举了状态的“名称”－－The state of the request. The five possible values are 0 = uninitialized, 1 = loading, 2 = loaded, 3 = interactive, and 4 = complete。
而《Ajax in Action》中好像根本就没有提到这5种状态的细节。
《Professional Ajax》中虽不尽人意，但还是有可取之处：There are five possible values for readyState:0 (Uninitialized): The object has been created but the open() method hasn’t been called.1 (Loading): The open() method has been called but the request hasn’t been sent.2 (Loaded): The request has been sent.3 (Interactive). A partial response has been received.4 (Complete): All data has been received and the connection has been closed.readyState有五种可能的值：0 (未初始化)： (XMLHttpRequest)对象已经创建，但还没有调用open()方法。
ajax的20个参数AJAX的原理，使用，深入了解
ajax的20个参数AJAX的原理，使⽤，深⼊了解AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）⼀，ajax参数1.url:要求为String类型的参数，（默认为当前页地址）发送请求的地址。
2.type:要求为String类型的参数，请求⽅式（post或get）默认为get。
注意其他http请求⽅法，例如put和delete也可以使⽤，但仅部分浏览器⽀持。
3.timeout:要求为Number类型的参数，设置请求超时时间（毫秒）。
此设置将覆盖$.ajaxSetup()⽅法的全局设置。
4.async:要求为Boolean类型的参数，默认设置为true，所有请求均为异步请求。
如果需要发送同步请求，请将此选项设置为false。
注意，同步请求将锁住浏览器，⽤户其他操作必须等待请求完成才可以执⾏。
5.cache:要求为Boolean类型的参数，默认为true（当dataType为script时，默认为false），设置为false将不会从浏览器缓存中加载请求信息。
6.data:要求为Object或String类型的参数，发送到服务器的数据。
如果已经不是字符串，将⾃动转换为字符串格式。
get请求中将附加在url后。
防⽌这种⾃动转换，可以查看 processData选项。
对象必须为key/value格式，例如{foo1:"bar1",foo2:"bar2"}转换为&foo1=bar1&foo2=bar2。
如果是数组，JQuery将⾃动为不同值对应同⼀个名称。
例如{foo:["bar1","bar2"]}转换为&foo=bar1&foo=bar2。
7.dataType:要求为String类型的参数，预期服务器返回的数据类型。
如果不指定，JQuery将⾃动根据http包mime信息返回responseXML或responseText，并作为回调函数参数传递。
经典的20道AJAX面试题
“Google Suggest”就是使用XMLHttpRequest对象来创建动态的Web接口：
当用户开始输入google的搜索框，Javascript发送用户输入的字符到服务器，然后服务器返回一个建议列表。
有，IE中通过new ActiveXObject()得到，Firefox中通过newXMLHttpRequest()得到
10、介绍一下XMLHttpRequest对象的常用方法和属性。
open(“method”,”URL”) 建立对服务器的调用，第一个参数是HTTP请求 方式可以为GET，POST或任何服务器所支持的您想调用的方式。
1、什么是AJAX，为什么要使用Ajax（请谈一下你对Ajax的认识）
什么是ajax：
AJAX是“Asynchronous JavaScript and XML”的缩写。他是指一种创建交互式网页应用的网页开发技术。
Ajax包含下列技术：
基于web标准（standards-basedpresentation）XHTML+CSS的表示；
AJAX的应用使用支持以上技术的web浏览器作为运行平台。这些浏览器目前包括：Mozilla、Firefox、Internet Explorer、Opera、Konqueror及Safari。但是Opera不支持XSL格式对象，也不支持XSLT。
20、AJAX都有哪些优点和缺点？
1、最大的一点是页面无刷新，用户的体验非常好。
ajax的缺点
1、ajax不支持浏览器back按钮。
2、安全问题 AJAX暴露了与服务器交互的细节。
3、对搜索引擎的支持比较弱。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
readyState属性包括五种可能的取值：
0：（未初始化）send方法还没有被调用
1：（加载中）已调用了send方法，请求还在处理
2：（已加载）send方法已完成，整个应答已接收
3：（交互中）正在解析应答
4：（已完成）应答已经解析，准备好进行下一步处理。
对象XMLHttpRequest
属性status的含义:
0**：未被始化
1**：请求收到，继续处理
2**：操作成功收到，分析、接受
3**：完成此请求必须进一步处理
4**：请求包含一个错误语法或不能完成
5**：服务器执行一个完全有效请求失败
100——客户必须继续发出请求
101——客户要求服务器根据请求转换HTTP协议版本
200——交易成功
201——提示知道新文件的URL
202——接受和处理、但处理未完成
203——返回信息不确定或不完整
204——请求收到，但返回信息为空
205——服务器完成了请求，用户代理必须复位当前已经浏览过的文件206——服务器已经完成了部分用户的GET请求
300——请求的资源可在多处得到
301——删除请求数据
302——在其他地址发现了请求数据
303——建议客户访问其他URL或访问方式
304——客户端已经执行了GET，但文件未变化
305——请求的资源必须从服务器指定的地址得到
306——前一版本HTTP中使用的代码，现行版本中不再使用
307——申明请求的资源临时性删除
400——错误请求，如语法错误
401——请求授权失败
402——保留有效ChargeTo头响应
403——请求不允许
404——没有发现文件、查询或URl
405——用户在Request-Line字段定义的方法不允许
406——根据用户发送的Accept拖，请求资源不可访问
407——类似401，用户必须首先在代理服务器上得到授权
408——客户端没有在用户指定的饿时间内完成请求
409——对当前资源状态，请求不能完成
410——服务器上不再有此资源且无进一步的参考地址
411——服务器拒绝用户定义的Content-Length属性请求
412——一个或多个请求头字段在当前请求中错误
413——请求的资源大于服务器允许的大小
414——请求的资源URL长于服务器允许的长度
415——请求资源不支持请求项目格式
416——请求中包含Range请求头字段，在当前请求资源范围内没有range指示值，请求也不包含If-Range请求头字段
417——服务器不满足请求Expect头字段指定的期望值，如果是代理服务器，可能是下一级服务器不能满足请求
500——服务器产生内部错误
501——服务器不支持请求的函数
502——服务器暂时不可用，有时是为了防止发生系统过载
503——服务器过载或暂停维修
504——关口过载，服务器使用另一个关口或服务来响应用户，等待时间设定值较长
505——服务器不支持或拒绝支请求头中指定的HTTP版本。