jQuery技术

jQuery 1.9升级指南 WEB前端开发

字号+ 作者:H5之家 来源:H5之家 2017-08-18 14:08 我要评论( )

web前端开发,专注前端开发,关注用户体验,关注国内外最新最好的前端开发技术和前端开发资讯的专业博客

原文地址:翻译的不对或者不通顺的地方欢迎拍砖留言。

概述

jQuery 1.9删除或修改了几个过去行为不一致或效率低下的几个API。他们在以前的jQuery版本中已经标注过过时(deprecated)的API,特别是1.7和1.8。

在做这些变化中,团队的目标是修复jQuery的行为不一致或比较难使用的地方,在这个过程中提高整体性能,减小了文件的体积。

此列表是看似给你一些不祥的预感。因为jQuery 1.9删除和修改一些以前做特殊需求的API,比如jQuery.browser。如何升级?首先,看看你的代码,最好的方法是尝试用jQuery 1.9和Migrate(迁移)插件(如下文所述)。

本指南作为标准的jQuery API文档的附录,作为快速上手jQuery 1.9的引导。

jQuery Migrate(迁移)插件

我们认识到,现有的网站和插件可能会受到这些变化的影响,所以提供一个过渡性的升级路径—— jQuery Migrate(迁移)插件。下面的说明中,在1.9中变化或删除的API,大部分可以使用jQuery Migrate(迁移)插件恢复。请注意,jQuery 1.9中所有的变化也将应用到jQuery 2.0中,jQuery Migrate(迁移)插件在jQuery2.0中也是可用的。

未压缩,开发版本的jQuery Migrate(迁移)插件使用时会在控制台中显示警告信息,详细的指出不兼容或删除等信息及解决方法。这使得它在现有的jQuery代码和插件上查找和修复问题时非常有用。jQuery Migrate(迁移)插件包含了1.6.4以来存在但1.9已不支持所有API。

压缩版本的的jQuery Migrate(迁移)插件,不会在浏览器控制台中产生任何不兼容或删除等信息,并且可以在jQuery 1.9或更高版本,或者旧的不兼容的jQuery代码或插件中使用。

理想情况下,这将只能作为一个短期的解决方案,但是这要你自己做出决定。

更多的信息请参见: jQuery Migrate plugin。

译者注:哥过一句嘴,尽早的修改原来不兼容的代码,毕竟使用jQuery Migrate(迁移)插件不是一个长久之计啊。

jQuery1.9中改变的地方

下面列表中说的并不代表jQuery 1.9中所有改变,只是我们预期的改变。完整的,详细的更改列表,请参阅jQuery的博客或访问bugs.jquery.com中发布的公告。

.toggle(function, function, … ) 方法删除

这个方法绑定两个或多个处理程序到匹配的元素,用来执行交替的点击事件。它不应该被混同于显示或隐藏匹配元素.toggle( )方法,因为它没有过时。前者被删除,以减少混乱和提高模块化程度。jQuery Migrate(迁移)插件可以恢复此功能。

译者注:具体查看API

jQuery.browser() 方法删除

jQuery.browser()方法从jQuery 1.3开始已经过时了,在1.9中被删除。 如果需要的话,jQuery Migrate(迁移)插件可以恢复此功能。我们建议如特征检测,请使用Modernizr库。

译者注:具体查看API

.live() 方法移除

.live()方法从jQuery 1.7开始已经过时了,在1.9中被删除。 我们建议使用.on()方法来替换升级你的代码。要完全匹配$(“a.foo”).live(“click”, fn),例如,你可以写$(document).on(“click”, “a.foo”, fn)(译者注:因为原来的live事件其实是绑定在文档document上的)。有关详细信息,请参阅.on()文档。在此期间,你可以使用jQuery Migrate(迁移)插件来恢复.live() 功能。

译者注:具体查看API 和

.die() 方法移除

.die()方法从jQuery 1.7开始已经过时了,在1.9中被删除。 我们建议使用. off()方法来替换升级你的代码。要完全匹配$(“a.foo”).die(“click”),例如,你可以写$(document).off(“click”, “a.foo”)。有关详细信息,请参阅.off()文档。在此期间,你可以使用jQuery Migrate(迁移)插件来恢复. die() 功能。

译者注:具体查看API 和

jQuery.sub() 方法移除

jQuery.sub()方法被移到jQuery Migrate(迁移)插件中。使用的频率证明它没有必要再保留在核心代码库中,jQuery Migrate(迁移)插件添加了此功能。

译者注:具体查看API

.add() 方法修改

.add()方法返回的结果总是按照节点在document(文档)中的顺序排列。在1.9之前,如果上下文或输入的集合中任何一个以脱离文档的节点(未在文档中)开始,使用.add()方法节点不会按照document(文档)中的顺序排序。现在,返回的节点按照文档中的顺序排序,并且脱离文档的节点被放置在集合的末尾。

译者注:具体查看API

.addBack(selector) 替换 .andSelf()

从jQuery1.8开始,.andSelf()方法已经被标注过时,在jQuery1.8和更高版本中应使用.addBack()。

我们认为对于“添加并返回”以前的结果集合这是一个更好的名字。新方法可以接受一个可选的选择器,该选择器可以用来过滤之前集合,将它添加到当前集合并返回。$(“section, aside”).children(“ul”).addBack(“aside”) 会根据他们在文档中的顺序,得到section与aside下所有ul子元素,外加所有aside元素。虽然.addSelf()在1.9中仍然可以使用,我们建议您尽快修改名称。如果使用.addSelf(),jQuery Migrate插件会提出警告。

译者注:具体查看API和

.after(), .before(), 和 .replaceWith()使用脱离文档的节点

1.9以前,.after(), .before(), 和 .replaceWith()将尝试在当前的jQuery集合中添加或改变节点,如果在当前的jQuery集的节点未连接到文档(注:即脱离文档的节点),在这种情况下,返回一个新的jQuery集合,而不是原来的那个集合。这将产生一些前后矛盾和彻底的错误 – 该方法可能会,也可能不会返回一个新的结果,这取决于它的参数!从1.9开始,这些方法总是返回原始未修改集并且试图在一个没有父节点的节点上使用.after(), .before(), or .replaceWith() 有没有任何效果 – 即这个集或它包含的节点两者都不被改变。

.appendTo, .insertBefore, .insertAfter, 和 .replaceAll

在1.9中,这些方法总是返回一个新的集合,使他们可以使用的链式调用和.end()方法。1.9之前,只有当他们是一个单独的目标元素时,他们将返回旧的集合。需要注意的是这些方法总是返回所有元素附加到目标元素的聚合集合。如果没有元素被目标选择器选中(例如,$(elements).appendTo(“#not_found”))那么返回的集合是空的。

AJAX 事件需要绑定到document

在jQuery 1.9中, 全局的AJAX事件(ajaxStart, ajaxStop, ajaxSend, ajaxComplete, ajaxError, and ajaxSuccess) 只能在document元素上触发。修改AJAX事件监听程序到document元素上。例如,如果目前的代码看起来像这样:

1 $.$.

修改成:

1 $$.

译者注:具体查看API

.trigger() “click” 事件时Checkbox/radio 的状态

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 小教程:自己创建一个jQuery长阴影插件

    小教程:自己创建一个jQuery长阴影插件

    2017-08-19 12:02

  • 标签:jQuery

    标签:jQuery

    2017-08-18 13:01

  • jQuery基础 (一) 样式篇

    jQuery基础 (一) 样式篇

    2017-08-18 12:01

  • jQuery标签选项卡切换代码

    jQuery标签选项卡切换代码

    2017-08-18 12:00

网友点评