AJAX 过程总结
AJAX 工作过程:
(1) 创建对象(需要处理兼容性问题)
创建XMLHttpRequest对象(创建一个异步调用对象)
<!-- ie6以上 -->
var xhr = new XMLHttpRequest();
<!-- ie6及以下 -->
var oAjax = new ActiveXObject("Microsoft.XMLHTTP")
// 兼容性处理
try{
var xhr = newXMLHttpRequest();
}catch(e){
var xhr = newActiveXObject("Microsoft.XMLHTTP");
}
(2) 连接服务器
创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息(get或post、url、同步或异步,默认异步为true)
xhr.open("get/post","1.php?username=Jack&age=12",true);
(3) 发送HTTP请求
xhr.send();
(4) 设置响应HTTP请求状态变化的函数
oAjax.onreadystatechange = function(){ //当请求状态改变时要调用的事件函数 }
(5) 获取异步调用返回的数据
xhr.onreadystatechange = function(){
if(xhr.readyStat e== 4 && xhr.status == 200){
<!-- responseText就是返回的数据 -->
alert(xhr.responseText);
}
}
(6) 使用JavaScript和DOM实现局部刷新
xhr.onreadystatechange = function(){
if(xhr.readyState == 4 && xhr.status == 200){
document.getElementById("myId").innerHTML=xhr.responseText;
}
}
AJAX 的缺点:
1、ajax 不支持浏览器 back 按钮。
2、ajax 存在安全性问题,暴露了与服务器交互的细节。
3、ajax 对搜索引擎的支持比较弱。
AJAX 过程总结的更多相关文章
- 用Promise对象封装JQuery的AJAX过程
let jqPostAjaxPromise = function(param){ return new Promise(function(resolve, reject){ $.ajax({ url: ...
- Ajax过程
http://www.cnblogs.com/daicunya/p/6227550.html 1.创建XMLHttpRequest对象,也就是创建一个异步调用对象. 2.创建一个新的HTTP请求,并指 ...
- 用js写个原生的ajax过程
var xhr=new XMLHttpRequset(); xhr.addEventListener("load",loadHandler); xhr.open("GET ...
- JQuery Ajax执行过程AOP拦截
JQuery Ajax过程AOP:用于在Ajax请求发送过程中执行必备操作,比如加载数据访问令牌. $.ajaxSetup({ type: "POST", error: funct ...
- Ajax完整篇(转载)
Ajax 完整教程 第 1 页 Ajax 简介Ajax 由 HTML.JavaScript™ 技术.DHTML 和 DOM 组成,这一杰出的方法可以将笨拙的 Web 界面转化成交互性的 Ajax 应用 ...
- ajax详细介绍
a.什么是Ajax Asynchronous JavaScript and XML(异步JavaScript和XML) 节省用户操作,时间,提高用户体验,减少数据请求 传输获取数据 ...
- 基于PHP的AJAX学习笔记(教程)
本文转载自:http://www.softeng.cn/?p=107 这是本人在学习ajax过程所做的笔记,通过本笔记的学习,可以完成ajax的快速入门.本笔记前端分别使用原生态的javascript ...
- CodeIgniter框架入门教程——第三课 URL及ajax
本文转载自:http://www.softeng.cn/?p=74 这节课讲一下CI框架的路由规则,以及如何在CI框架下实现ajax功能. 首先,先介绍CI框架的路由规则,因为CI框架是在PHP的基础 ...
- AJAX 页面数据传递
$.ajax({ //一个Ajax过程 type: "post", //以post方式与后台沟通 url: "personstockajax.php", //与 ...
随机推荐
- Lua脚本语法说明(转):
Lua脚本语法说明(增加lua5.1部份特性) 转自:http://www.cnblogs.com/ly4cn/archive/2006/08/04/467550.html Lua 的语法比较简单,学 ...
- APUE4.4设置用户ID和设置组ID && 4.5文件访问权限
- 【洛谷】【动态规划(多维)】P1006 传纸条
[题目描述:] 小渊和小轩是好朋友也是同班同学,他们在一起总有谈不完的话题.一次素质拓展活动中,班上同学安排做成一个m行n列的矩阵,而小渊和小轩被安排在矩阵对角线的两端,因此,他们就无法直接交谈了.幸 ...
- 【转】ios开发证书,描述文件,bundle ID的关系
ios开发证书,描述文件,bundle ID的关系 苹果为了控制应用的开发与发布流程,制定了一套非常复杂的机制.这里面的关键词有:个人开发者账号,企业开发者账号,bundle ID,开发证书,发布 ...
- P1569 [USACO11FEB]属牛的抗议
题目描述 Farmer John's N (1 <= N <= 100,000) cows are lined up in a row and numbered 1..N. The cow ...
- 通过ReentrantLock简单了解下并发包中的锁
ReentrantLock在进行实例化时,可以通过构造函数的参数选择是否使用公平锁FairSync或者非公平锁NonfairSync,两者的区别比较简单,如果是公平锁则新来的线程会先检测同步队列中是否 ...
- C++类型转换符重载
对于用户自定义的类类型,实现它们和其他数据类型之间的转换有两种方法:(1)通过转换构造函数进行类型转换:(2)通过类型转换函数进行类型转换:转换构造函数: 类名(待转换类型) { 函数体; } ...
- Red Hat Linux 挂载外部资源
在我们安装的Red Hat Linux 中.当中一半机器为最主要的server配置,没有桌面环境.在从U盘上复制文件的时候可就犯难了.在网上查了查才知道.要訪问U盘就必须先将它们挂载到Linux系统的 ...
- webpack初起步
webpack 用于编译 JavaScript 模块.一旦完成安装,就可以通过 webpack 的 CLI 或 API 与其配合交互. 首先创建一个目录,进入目录中,初始化npm 然后本地安装webp ...
- 配置bond
注意:配置bond要有两个以上的网口 1.配置文件所有目录:/etc/sysconfig/network-scripts 网口配置文件名规则:以ifcfg-开头,然后接着是网口名 例如:eth0的配置 ...