6 《锋利的jQuery》Ajax的应用(略。)
Ajax的优势
1、不需要插件支持
2、优秀的用户体验
3、提高web程序的性能(传输数据的方式,按需发送)
4、减轻服务器和带宽的负担
Ajax的不足
1、浏览器对XMLHttpRequest对象支持度不足
2、破坏浏览器前进、“后退”的正常功能
3、对搜索引擎的支持不足
4、开发和调试工具的缺乏
Ajax的核心是XMLHttpRequest对象,它是通过Ajax实现的关键——发送异步请求、接收响应及执行回调都是通过它来完成的。
$(function () {
var xmlHttpReq = null;
// 创建对象
// IE5,6是以ActiveXObject方式引入XMLHttpRequest
if (window.ActiveXObject) {
xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
}
// 其他浏览器XMLHttpRequest是window的子对象
else if (window.XMLHttpRequest) {
xmlHttpReq = new XMLHttpRequest();
}
xmlHttpReq.open("GET", "data.txt", true);
xmlHttpReq.onreadystatechange = RequestCallBack; //当readyState值改变时,会激发onreadystatechange事件,
//使用该属性来注册回调事件处理器
xmlHttpReq.send(null); //发送请求
function RequestCallBack() {
if (xmlHttpReq.readyState == 4) { //请求完成加载
if (xmlHttpReq.status == 200) { //响应已经成功
$("#mes").html(xmlHttpReq.responseText);
}
}
}
});
jquery对Ajax操作进行了封装,在jQuery中$.ajax()方法属于最底层的方法,第2层是load()、$.get()、$.post()方法,第3层是$.getScritp()和$.getJSON()方法。
1、load()方法
load(url [,data] [,callback])
a、载入HTML文档 :$("#resText").load("test.html");
b、筛选载入的HTML文档:$("#resText").load("test.html .para");
c、传递方式:如果没有参数则采用GET方式传递,反之,则会自动转换为POST方式
d、回调参数:该回调函数有三个参数,分别是
$("#resText").load("test.html",function(responseText,textStatus,XMLHttpRequest){
// responseText: 请求返回的内容
// textStatus: 请求状态:success、error、notmodified、timeout四种
// XMLHttpRequest: XMLHttpRequest对象
})
tip:在load()方法中无论Ajax请求是否成功,只要当请求完成(complete)后,回调函数就被触发
2、$get()和$pos()方法
load()方法通常用来从web服务器上获取静态的数据文件,而$get()或者$post()是传参数给服务器中的页面。
$get()和$pos()方法是jquery中的全局函数,而在此之前的jquery方法都是对jquery对象进行操作的。
$.get(url [,data] [,callback] [,type])
| 参数名称 | 类型 | 说明 |
| url | String | 请求的HTML页的地址 |
| data(可选) | Object | 发送至服务器的key/value数据会作为QueryString附加到请求URL中 |
| callback(可选) | Function | 载入成功时回调函数(当为success)自动将请求结果和状态传递给该方法 |
| type(可选) | String | 服务器返回内容的格式,包括xml,html,script,json,text和_default |
回调函数跟load()方法不同的是,只有当数据成功返回(success)后才被调用。
function(data,textStatus){
//data 返回的内容,可以是XML文档,JSON文件,HTML片段等
//textStatus 请求状态:success,error,notmodified,timeout 四种
}
6 《锋利的jQuery》Ajax的应用(略。)的更多相关文章
- 锋利的JQuery —— Ajax
大图猛戳
- 锋利的jQuery学习总结
通过对<锋利的jQuery>(第二版)一书的学习,发现此书讲解通俗易懂,是学习jQuery的一本很好的指导书,特作如下总结.此书主要讲解了jQuery的常用操作,包括认识jQuery,jQ ...
- 【锋利的jQuery】中全局事件ajaxStart、ajaxStop不执行
最近一直都在研究[锋利的jQuery],确实是一本好书,受益匪浅.但由于技术发展及版本更新等原因,里面还是有些坑需要踩的. 比如:第六章七节中提到的全局事件ajaxStart.ajaxStop照着案例 ...
- 锋利的jQuery(第二版)学习总结
通过对<锋利的jQuery>(第二版)一书的学习,发现此书讲解通俗易懂,是学习jQuery的一本很好的指导书,特作如下总结. 此书主要讲解了jQuery的常用操作,包括认识jQuery,j ...
- WCF入门教程(四)通过Host代码方式来承载服务 一个WCF使用TCP协议进行通协的例子 jquery ajax调用WCF,采用System.ServiceModel.WebHttpBinding System.ServiceModel.WSHttpBinding协议 学习WCF笔记之二 无废话WCF入门教程一[什么是WCF]
WCF入门教程(四)通过Host代码方式来承载服务 Posted on 2014-05-15 13:03 停留的风 阅读(7681) 评论(0) 编辑 收藏 WCF入门教程(四)通过Host代码方式来 ...
- 《锋利的jQuery》学习总结
通过对<锋利的jQuery>(第二版)一书的学习,发现此书讲解通俗易懂,是学习jQuery的一本很好的指导书,特作如下总结.此书主要讲解了jQuery的常用操作,包括认识jQuery,jQ ...
- IE8/9 JQuery.Ajax 上传文件无效
IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...
- jquery ajax解析
jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯. 废话少说,直接进入正题,我们先来看一些简单的方法,这些方法都是对 ...
- jQuery.ajax 根据不同的Content-Type做出不同的响应
使用H5+ASP.NET General Handler开发项目,使用ajax进行前后端的通讯.有一个场景需求是根据服务器返回的不同数据类型,前端进行不同的响应,这里记录下如何使用$.ajax实现该需 ...
- jQuery.ajax(url,[settings])
概述 通过 HTTP 请求加载远程数据. jQuery 底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等.$.ajax() 返回其创建的 XMLHttpRequest 对象. ...
随机推荐
- EasyMvc入门教程-图形控件说明(21)线形图+柱状图+饼形图
本章将介绍一些基本但常用的图形:线型图,柱状图和饼形图. 以上三种图形对于的数据都是键值对数组,请参考第一个例子: @{ var data = new List<LineItem>(); ...
- Git历险记(五)——Git里的分支&合并
分支与合并 在Git里面我们可以创建不同的分支,来进行调试.发布.维护等不同工作,而互不干扰.下面我们还是来创建一个试验仓库,看一下Git分支运作的台前幕后: $rm -rf test_branch_ ...
- Mysql的时间戳转date类型
mysql 的 时间戳转date类型 select FROM_UNIXTIME(1491031706235/1000,'%Y-%m-%d') from dual;
- 【开发总结】—— BABYLON 项目开发必备系列
前言:在公司主要使用Babylon.js作为前端引擎,我自己在开发中总结到基本上每一个新项目都会需要这些基本设置. 一.ios兼容:解决镜面反射 如果不加offline,材质中有镜面反射,苹果手机 ...
- shell脚本中数组array常用技巧学习实践
shell中数组的下标默认是从0开始的 1.将字符串放在数组中,获取其长度 #!/bin/bashstr="a b --n d"array=($str)length=${#arra ...
- Vue.js 很好,但会比 Angular 或 React 更好吗?
文章转自:http://www.oschina.net/translate/vuejs-is-good-but-is-it-better-than-angular-or-rea Vue.js 是一个用 ...
- Nginx在windows2003下的使用 PHP
nginx真正能够发挥其良好的负载能力的,是在linux下. 我们在windows下搭建好环境,测试开发使用.强烈建议在linux下开发的. ---- 下载nginx 访问www.nginx.org, ...
- 通俗的理解java的堆和栈
堆 可以把堆理解为一家餐厅,里面有200张桌子,也就是最多能同时容纳200桌客人就餐,来一批客人就为他们安排一些桌子,如果某天来的客人特别多,超过200桌了,那就不能再接待超出的客人了.当然,进来吃饭 ...
- 存储过程清理N天前数据
CREATE OR REPLACE PROCEDURE APICALL_LOG_INTERFACE_CLEAN ( CLEANDAY IN Number --天数 ) AS v_cleanDay nu ...
- jquery中的clone()方法
jquery中不能直接把选择到的元素如$('div')添加到其他地方,而需要使用$('div')[0]等 clone()方法直接复制HTML代码,所以可以直接用来添加元素.