博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
AJAX的问题
阅读量:5162 次
发布时间:2019-06-13

本文共 2030 字,大约阅读时间需要 6 分钟。

1.什么是AJAX

AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。

 AJAX:Asynchronous Javascript And XML,异步的JS和XML。

2002年Google在搜索引擎中提出了“Google Suggest”效果,把使用的技术命名为“AJAX”,为了避免浏览器中出现“一片惨白”影响浏览体验。

 实现原理:在客户端浏览网页内容的同时,服务器在提供最新的内容,局部更新在页面中——无提交无刷新的页面内容局部更新技术

 AJAX应用涉及到的技术:HTML、CSS、JS、DOM、XML、HTTP协议等——纯前端技术,需要与Web服务器交互。

2.浏览器发起HTTP请求的两种方式:

(1)同步请求:地址栏、表单提交、超链接跳转、JS跳转

(2)异步请求:使用XHR对象

3.使用XHR发起HTTP请求的步骤

 1 创建xhr对象

  var xhr = new XMLHttpRequest();

 2 连接到服务器

   xhr.open('GET', 'x.php', true);

  3 发送请求消息

   xhr.send( null / 'k=v&k=v' );

  4 监听xhr的状态改变事件

  xhr.onreadystatechange = function(){

  if(xhr.readyState===4){ //响应消息接收完成

  if(xhr.status===200){ //响应完成且成功

  }else{ //响应完成但有问题

   }}}

4.XHR对象成员属性:

  1. readyState:0    就绪状态,随着请求-响应的进行自动改变
  2. response:""
  3. responseText:""    响应消息主体,readyState变为3才有值
  4. responseType:""
  5. responseURL:""
  6. responseXML:null  响应消息主体,readyState变为3才有值
  7. status:0     响应状态码readyState变为2有值
  8. statusText:""    原因短句,readyState变为2有值
  9. timeout:0
  10. DONE:4    readyState可取值之一,响应消息接收完成
  11. HEADERS_RECEIVED:2    readyState可取值之一,开始接收响应消息头部
  12. LOADING:3    readyState可取值之一,开始加载响应消息主体
  13. OPENED:1    readyState可取值之一,XHR已经打开到服务器的连接
  14. UNSENT:0     readyState可取值之一,请求消息尚未发送

5.XHR对象成员方法:

  1. getAllResponseHeaders:getAllResponseHeaders()
  2. getResponseHeader:getResponseHeader()   读取响应头部
  3. setRequestHeader:setRequestHeader()    设置请求头
  4. open:open()    打开到服务器的连接
  5. send:send()    发送请求消息

 6.使用Microsogt浏览器IE(6以下):

 

Microsogt浏览器IE(6以下)使用MSXML解析器处理XML,如果编写的AJAX应用程序并不简单,根据IE中安装的JacaScript技术的版本不同,MSXML实际上有两种不同的版本,因此必须对这两种情况分别编写代码,如:

var xml=false;try{  xml=new ActiveXObject("Msxml2.XMLHTTP");      }catch(e){  try{  xml=new ActiveXObject("Microsoft.XMLHTTP");   }  catch(e2){    xml=false;    }}

xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");

xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

这两行代码基本上就是尝试使用一个版本的MSXML创建对象,如果失败则使用另一个版本创建该对象。

或者官方文档

var xmlhttp;if (window.XMLHttpRequest)  {
// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); }else {
// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); }

 

转载于:https://www.cnblogs.com/xin9984/p/6103109.html

你可能感兴趣的文章
jquery的ajax用法
查看>>
设计模式-策略模式(Strategy)
查看>>
django orm 数据查询详解
查看>>
JarvisOJ Basic 熟悉的声音
查看>>
C# list导出Excel(二)
查看>>
CAS 单点登录模块学习
查看>>
跟着辛星用PHP的反射机制来实现插件
查看>>
Android应用开发-网络编程①
查看>>
input中的name,value以及label中的for
查看>>
静态库制作-混编(工程是oc为基础)
查看>>
jQuery 显示加载更多
查看>>
代理模式
查看>>
Confluence 6 系统运行信息中的 JVM 内存使用情况
查看>>
Confluence 6 升级以后
查看>>
用JS实现版面拖拽效果
查看>>
二丶CSS
查看>>
《avascript 高级程序设计(第三版)》 ---第二章 在HTML中使用Javascript
查看>>
JS一些概念知识及参考链接
查看>>
TCP/IP协议原理与应用笔记24:网际协议(IP)之 IP协议的简介
查看>>
SAP HANA开发中常见问题- 基于SAP HANA平台的多团队产品研发
查看>>