响应模式
blog
属性
classchangntbascjavascrip
- type = "button"name = "btn"id = "btn"value = "按钮" / >
JS
- //点击按钮弹出1.txt的内容
- var oBtn = document.getElementById("btn");
- oBtn.onclick = function() {
- //打开浏览器
- /*
- 1.创建一个ajax对象
- ie6以下new ActiveXObject('Microsoft.XMLHTTP')
- * */
- var xhr = null;
- try {
- xhr = new XMLHttpRequest();
- } catch(e) {
- xhr = new ActiveXObject('Microsoft.XMLHTTP');
- }
- //在地址栏中输入地址
- /*
- open方法
- 参数
- 1.打开方式
- 2.地址
- 3.是否异步
- 异步:非阻塞模式 前面的代码不会影响后面代码的执行
- 同步:阻塞模式 前面的代码会影响后面代码的执行
- * */
- //异步请求
- xhr.open('get', '1.txt', true);
- //提交 发送请求
- xhr.send();
- //等待服务器返回内容
- /*readyState:ajax工作状态 请求状态
- * 0 (初始化)还没有调用open()方法
- * 1 (载入)已经调用send()方法,正在发送请求
- * 2 (载入完成)send()方法完成,已收到全部响应内容
- * 3 (解析)正在解析响应内容
- * 4 (完成)响应内容解析完成,可以在客户端调用了
- *
- status属性:服务器(请求资源)的状态,http状态码
- 返回的内容
- responseText:返回以文本形式存放的内容
- responseXML:返回XML形式的内容*/
- xhr.onreadystatechange = function() {
- if (xhr.readyState == 4) {
- if (xhr.status == 200) {
- alert(xhr.responseText);
- } else {
- alert('出错了,Err' + xhr.status);
- }
- }
- }
- }
js ajax 请求流程
来源: http://www.bubuko.com/infodetail-2453719.html