黑马程序员技术交流社区

标题: 【沈阳校区】ajax对象常用属性，事件，方法大小写问题 [打印本页]

作者: fengdian135 时间: 2019-1-23 10:44
标题: 【沈阳校区】ajax对象常用属性，事件，方法大小写问题
下面是ajax对象的一些常用属性，事件和方法
　　1）标准的ajax对象的属性有readyState，status，responseText，responseXML

　　2）非标准ajax对象属性，针对IE浏览器的，有responseBody，2进制数据流。如果不考虑浏览器兼容，这个属性+VBScript能很好的解决乱码问题。　　
Visual Basic code
?

[size=1em]Function [size=1em]Bytes2BStr(vin)[size=1em]'二进制转字串
[size=1em]    [size=1em]strreturn = [size=1em]""
[size=1em]    [size=1em]for i = 1 to lenb(vin)
[size=1em]    [size=1em]thischarcode = ascb(midb(vin,i,1))
[size=1em]    [size=1em]if thischarcode < &h80 then
[size=1em]       [size=1em]strreturn = strreturn & chr(thischarcode)
[size=1em]    [size=1em]else
[size=1em]       [size=1em]nextcharcode = ascb(midb(vin,i+1,1))
[size=1em]       [size=1em]strreturn = strreturn & chr(clng(thischarcode) * &h100 + cint(nextcharcode))
[size=1em]       [size=1em]i = i + 1
[size=1em]    [size=1em]end if
[size=1em]    [size=1em]next
[size=1em]    [size=1em]Bytes2BStr = strreturn
[size=1em]End [size=1em]Function

　　3）事件onreadystatechange，状态转换函数

　　4）方法有setRequestHeader，open，send，用于设置响应头的，当指定提交方法为POST的时候，需要设置content-type为application/x-www-form-urlencoded，如果未设置这个响应头，请求的动态页无法使用键值对的形式获取到值，不过可以从二进制流中生成提交的数据。
参考
ajax指定为post但是未设置content-type或未指定键时时如何获取提交的内容

　　容易出现错误的问题
1）对于使用XMLHttpRequest创建的对象，包括IE7+，属性是严格区分大小写的，一定要注意大小写的问题，要不不区分大小，属性值就是 undefined。如readyState写成readystate，responseText写成responsetext。

2）对于IE浏览器，如果是先判断activexobject，那么会执行activexobject创建xhr对象，使用acx创建的xhr对象，属性，事件，方法都不区分大小写

3）使用XMLHttpRequest创建时，onreadystatechange一定全部为小写，要不相当于给xhr对象赋值一个自定义属性，而不是实际的状态转换函数。这样永远都不执行回调。对于IE使用activexobject创建的xhr对象，不区分大小写

4）同2，3点，XMLHttpRequest创建时，调用方法一定要区分大小写，要不会出错，提示找不到方法。IE使用activexobject创建不会区分大小写。
　特别强调的是，一定要调用open方法后，才能执行setRequestHeader方法，要不会出错。

　　对于手写ajax代码一些建议
1）为get提交时，不需要设置content-type了，除非请求的是一些需要检查content-type生成一些对应的数据格式的文件。如 asp.net的webservice会检查content-type，如果指定content-type为application/json，会生成对应的json格式的字符串。
参考webservice json

2）为get提交时，如果没有数据，调用send方法时最好添加一个null作为参数。xhr.send(null);

3）为post提交时，一定不要忘记在调用open方法后，再调用setRequestHeader方法设置content-type为application/x-www-form-urlencoded

4）在使用responseText，responseXML和responseBody【IE only】，status属性时，需要在readyState==4，status状态==200【在线测试】或者status状态==0【本地测试】时再使用

JavaScript code
?

[size=1em]    [size=1em]var [size=1em]xhr = window.XMLHttpRequest ? [size=1em]new [size=1em]XMLHttpRequest() : [size=1em]new [size=1em]ActiveXObject([size=1em]"microsft.xmlhttp"[size=1em]);
[size=1em]    [size=1em]xhr.open([size=1em]'get'[size=1em], [size=1em]'index.html'[size=1em], [size=1em]true[size=1em]);
[size=1em]    [size=1em]xhr.onreadystatechange = [size=1em]function [size=1em]() {
[size=1em]       [size=1em]if [size=1em](4 == xhr.readyState) {
[size=1em]             [size=1em]if [size=1em](200 == xhr.status || 0 == xhr.status) {
[size=1em]                [size=1em]//=========正常返回后的处理代码
[size=1em]             [size=1em]}
[size=1em]             [size=1em]else [size=1em]alert([size=1em]'动态页出问题了~~'[size=1em]);
[size=1em]       [size=1em]}
[size=1em]    [size=1em]}
[size=1em]    [size=1em]xhr.send([size=1em]null[size=1em]);

5）如果为异步执行时，需要添加状态转换函数，然后在readyState位4时使用responseText或者responseXML属性。
如果为同步执行时，可以在send完后，直接使用responseText或者responseXML属性，不需要添加onreadystatechange状态转换函数了。不过为同步时如果网速慢容易造成浏览器假死，用户体验不好。

欢迎光临黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2