XMLHttpRequest 用法解析

XMLHttpRequest 构造函数,用于创建一个XMLHttpRequest实例

new XMLHttpRequest()

实例方法 :

XMLHttpRequest.abort()

如果请求已被发送,则立刻中止请求。

XMLHttpRequest.getAllResponseHeaders()

以字符串的形式返回所有用 CRLF 分隔的响应头,如果没有收到响应,则返回 null

XMLHttpRequest.getResponseHeader()

返回包含指定响应头的字符串,如果响应尚未收到或响应中不存在该报头,则返回 null

XMLHttpRequest.open()

初始化一个请求。该方法只能在 JavaScript 代码中使用,若要在 native code 中初始化请求,请使用 openRequest()

XMLHttpRequest.overrideMimeType()

重写由服务器返回的 MIME 类型。

XMLHttpRequest.send()

发送请求。如果请求是异步的(默认),那么该方法将在请求发送后立即返回。

XMLHttpRequest.setRequestHeader()

设置 HTTP 请求头的值。您必须在 open() 之后、send() 之前调用 setRequestHeader() 方法。

实例属性:

XMLHttpRequest.onreadystatechange

当 readyState 属性发生变化时调用的 EventHandler

XMLHttpRequest.readyState 只读

返回 一个无符号短整型(unsigned short)数字,代表请求的状态码。

XMLHttpRequest.response 只读

返回一个 ArrayBufferBlobDocument,或 DOMString,具体是哪种类型取决于 XMLHttpRequest.responseType 的值。其中包含整个响应体(response body)。

XMLHttpRequest.responseText 只读

返回一个 DOMString,该 DOMString 包含对请求的响应,如果请求未成功或尚未发送,则返回 null

XMLHttpRequest.responseType

一个用于定义响应类型的枚举值(enumerated value)。

XMLHttpRequest.responseURL 只读

返回响应的序列化(serialized)URL,如果该 URL 为空,则返回空字符串。

XMLHttpRequest.responseXML 只读

返回一个 Document,其中包含该请求的响应,如果请求未成功、尚未发送或时不能被解析为 XML 或 HTML,则返回 null

XMLHttpRequest.status 只读

返回一个无符号短整型(unsigned short)数字,代表请求的响应状态。

XMLHttpRequest.statusText 只读

返回一个 DOMString,其中包含 HTTP 服务器返回的响应状态。与 XMLHTTPRequest.status 不同的是,它包含完整的响应状态文本(例如,"200 OK")。

注意:根据 HTTP/2 规范(8.1.2.4 Response Pseudo-Header Fields,响应伪标头字段),HTTP/2 没有定义任何用于携带 HTTP/1.1 状态行中包含的版本或原因短语的方法。

XMLHttpRequest.timeout

一个无符号长整型(unsigned long)数字,表示该请求的最大请求时间(毫秒),若超出该时间,则请求会自动结束。

XMLHttpRequestEventTarget.ontimeout

当请求超时调用的 EventHandler

XMLHttpRequest.upload 只读

XMLHttpRequestUpload,代表上传过程。

XMLHttpRequest.withCredentials

一个布尔值,用来指定跨域 Access-Control 请求是否应带有授权信息,如 cookie 或授权 header 头。

例子:

var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function(){
        if (xhr.readyState == 4){
            if ((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304){
                alert(xhr.responseText);
            } else {
                alert("Request was unsuccessful: " + xhr.status);
            }
        }
    };
    xhr.open("get", "example.txt", true);
    xhr.send(null);

总结:

使用步骤

1.创建实例 new  new XMLHttpRequest();

2. 对onreadystatechange事件添加监听

3.调用  xhr..open(method, url, async);

4. 设置请求头 xhr.setRequestHeader(header, value);

5. 发送请求, xhr.send() 


xhr.send(null);
// xhr.send('string');
// xhr.send(new Blob());
// xhr.send(new Int8Array());
// xhr.send({ form: 'data' });
// xhr.send(document);
xhr.send("foo=bar&lorem=ipsum"); 
// xhr.send('string'); 
// xhr.send(new Blob()); 
// xhr.send(new Int8Array()); 
// xhr.send({ form: 'data' }); 
// xhr.send(document);

6. 响应在onreadystatechange处理,或调用xhr.abort()中断请求

发布了21 篇原创文章 · 获赞 2 · 访问量 7283

猜你喜欢

转载自blog.csdn.net/qq_31261131/article/details/105469411