Django学习笔记-AJAX-xhr

XHR成员

• 1、open()
• 2、send()
• 3、属性 – readyState
• 4、属性 – requestText
• 5、属性 – status
• 6、事件 – onreadystatechange
• 7、创建异步对象
• 示例1：GET请求
• 示例2：POST请求

1、open()

作用:创建连接(不发送，只是创建)语法:open(method, url, asyn)参数:method: 请求方式, \'get\'或\'post\'url: 请求地址,字符串asyn: 是否采用异步的方式 true(异步), false(同步)

示例:

<script>xhr.open(\'post\', \'/shu\', true)</script>

2、send()

作用:通知xhr向服务器发请求语法:send(body)参数:get请求: body的值为nullpost请求: body的值为请求数据 ->send(\'请求数据\')

3、属性 – readyState

作用:请求状态，通过不同的请求状态来表示xhr与服务器的交互情况状态码:0 : 代理被创建，但尚未调用send()方法1 : open() 方法已经被调用2 : send()方法已经被调用, 响应头已经被接受3 : 下载中；responseText 属性已经包含部分属性4 : 下载操作以完成

4、属性 – requestText

作用：响应数据

5、属性 – status

作用: 服务端的响应状态码状态码:200 : 表示服务器正确的处理了所有请求并给出响应404 : 请求资源不存在500 : 服务器内部错误

6、事件 – onreadystatechange

作用:每当xhr的readyState发生改变的时候都会促发的操作也作为回调函数；当readyState的值为4且status的状态码为200时， 才可以获取响应数据

7、创建异步对象

<script>function createXhr(){if (windows.XMLHttpRequest){return new XMLHttpRequest();}else {return ActiveXObject(\"Microsoft.XMLHTTP\")}}</script>

XMLHttpReqoest 是一个代理,原来发请求的方式，是在浏览器地址栏中输入地址然后回车,浏览器 就根据地址向指定浏览器法请求，并等待请求当请求回来后，浏览器刷新页面异步:浏览器不发请求, 是js调用XMLHttpRequest对象请求的发送,并可以获得服务器请求，在对页面进行局部的渲染优点:减少了数据量优化体验减少等待为更多功能提供可实现的可能性异步对象指的是: xhr对象有两种方式可以生成xhr对象一种是IE低版本浏览器(IE6以及以下的)， 使用ActiveXObject(\"Micerosoft.XMLHTTP\")

示例1：GET请求

<script>xhr = createXhr()xhr.open(\'get\', \'/shu\', true)xhr.onreadystatechange = function(){if(xhr.readyState == 4 && xhr.status == 200){data = xhr.responseText}}xhr.send(null)</script>

示例2：POST请求

<script>// 创建 Xhr 对象xhr = createXhr();xhr.open(\'post\', \'/shu\', true)xhr.onreadystatechange = function(){if(xhr.readyState == 4 && xhr.status == 200){// 获取响应数据data = xhr.responseText;}}// 修改请求头中的Content-Type, 将其变为表单提交头(将其变为标准的from提交)xhr.setRequestHeader(\'Content-Type\', \'application/x-www-form-urlencoded\');xhr.send(preme)</script>