《jquery 3 中的新增功能汇总介绍》由会员分享，可在线阅读，更多相关《jquery 3 中的新增功能汇总介绍（11页珍藏版）》请在金锄头文库上搜索。
1、我真正系统地接触和学习党的基本知识是在这次中级党校的培训班上。通过学习，了解了党的发展历程，对党的性质、宗旨、任务等基本知识有了进一步的了解jQuery 3 中的新增功能汇总介绍本文带你了解了一遍 jQuery 3 将会带来的一些重大变化。或许你已经注意到了，这个版本是可能对你现有的项目产生太大的影响，因为没有引入太多许多重大更改。从jQuery 震撼整个 Web ，至今已有十年了，我们有很好的理由一直坚持使用维护它。jQuery为用户提供了 DOM 进行操作，执行 Ajax 请求，创建动画等等，极为友好的接口。此外，与 DOM API 不同的是，jQuery 采用了 复合模式（composi
2、te pattern）。 正因为如此，你可以在一个jQuery集合上调用jQuery方法，而不用担心集合包含的元素数量（零，一个或多个）。在未来的几周内，随着 jQuery 3 的发布，jQuery 会到达一个重要的里程碑。jQuery 3 修复了很多 bug，增加了新的方法，弃用并移除了一些功能，并改变了一些功能的行为。在这篇文章中，我重点讲解jQuery 3所带来的一些最大的变化。新特性（New Features）在下面的章节中，我将讨论jQuery 3中新增的重要特性。forof 循环jQuery 3 将提供for.of循环语句，可以用来遍历一个jQuery集合所有的 DOM 元素。这种
3、新的迭代器ECMAScript XX（又名的ECMAScript6）规范的一部分。它能实现对可遍历对象（包括 Array、Map、Set 等）的循环。当使用这个新的迭代方法时，您每次接收的值不是一个jQuery集合，而是一个DOM元素。当你对一个jQuery集合执行操作时，这个新的迭代方法可以少许改善你的代码。为了理解这个迭代方法是如何工作的，假设你想给页面中每个input元素分配一个 ID。在 jQuery 3 之前，你可以这样写：var $inputs = $(input);for(var i = 0; i $inputsi.id = input- + i;而在 jQuery 3 中，你可
4、以这样写：var $inputs = $(input);var i = 0;for(var input of $inputs) input.id = input- + i+;$.get() 和 $.post()的新签名jQuery 3 为 $.get() 和 $.post() 工具函数增加了新签名，为的是使得它们和 $.ajax() 的接口风格保持一致。新签名是这样的：$.get(settings)$.post(settings)settings 是一个可以具有许多属性的对象。这是对象和 提供给$.ajax() 的对象 是相同的。更多详细的介绍，详细介绍，请参考 $.ajax()页面。传递给$
5、.get() 和 $.post() 的对象，跟传递给 $.ajax() 的对象相比，唯一的区别是前者 method 属性总是会被忽略。其原因是，$.get() 和 $.post() 都有一个预设的HTTP方法来执行Ajax请求（ $.get() 用 GET，而 $.post() 用 POST）。一般说来，你不要用 $.get()尝试发送 POST 请求。考虑下面这段代码：$.get( url: https:/www.audero.it, method: POST / This property is ignored);尽管设置了method属性，该语句还是不能发送 POST 请求，而只能发送
6、GET 请求。采用 requestAnimationFrame() 来实现动画所有现代浏览器，包括Internet Explorer10及以上版本，都支持 requestAnimationFrame。jQuery 3 将会在内部采用这个 API 来实现动画，以便达到更流畅、更省CPU资源的动画效果。unwrap()jQuery 3 为 unwrap() 方法增加了一个可选的选择器参数。这个方法的新签名为：unwrap(selector)有了这一变化，你就可以传入包含一个选择器表达式的字符串，在父元素内进行匹配。如果存在匹配，匹配的子元素将被解包;否则，不进行任何操作。被变更的特性jQuery
7、3 还修改了一些特性的行为。:visible 和 :hiddenjQuery 3修改了 :visible 与 :hidden 过滤器的含义。只要元素具有任何布局盒，包括那些宽度和/或高度为0的情况，则元素被认为是:visible。比如说，br 元素和没有内容的内联元素进可以通过 :visible 过滤器进行选择。所以，假如页面有如下标记：然后执行下面的语句：console.log($(body :visible).length);在 jQuery 1.x 和 2.x 中，你得到的结果会是 0；但在 jQuery 3 中，你会得到 2。data()另一个重要变化是跟 data() 方法的行为有关
8、。调整主要是为了让该方法符合 Dataset API 规范。jQuery 3 将所有属性的键都改为驼峰式大小写形式。要理解这个变化，先看下面这个例子。如果你使用 jQuery 3 之前的版本，你可以写如下代码：var $elem = $(#container);$elem.data( my-property: hello);console.log($elem.data();您将在控制台上获得如下结果：my-property: hello而在jQuery 3 中，你会获得如下结果：myProperty: hello请注意，在 jQuery 3 中，属性名已经变成了驼峰形式，没有横杠（连字符）；而
9、在以前的版本中，属性名会保持全小写，并原样保留横杠（连字符）。Deferred 对象jQuery 3改变了Deferred 对象的行为，Promise 对象的前身，改善与 Promise/A+ 提案的兼容性。这个对象及其历史非常有意思，你可以读读官方文档，或者看看我的书 jQuery 实战，第 3 版，这本书也涵盖了 jQuery 3。在 jQuery 1.x 和 2.x 中，传入 Deferred 中的回调函数中如果出现未捕获异常，会导致程序停止执行。而原生的 Promise 对象并非如此，它会抛出异常，并不断向上冒泡，直至到达 window.onerror（通常）。如果你没有定义一个函数来
10、处理这个错误事件的话（通常我们都不会这么做），则会显示异常消息，程序终止执行。jQuery 3 会遵循原生的 Promise 对象的模式。因此，抛出的异常将被视为一个失败状态（rejection），从而执行失败回调。完成之后，整个进程就继续执行，后续的成功回调将被执行。为了让你更好地理解这个差异，让我们来看一个小例子。考虑下面的代码：var deferred = $.Deferred();deferred.then(function() throw new Error(An error);).then( function() console.log(Success 1); , function
11、() console.log(Failure 1); ).then( function() console.log(Success 2); , function() console.log(Failure 2); );deferred.resolve();在 jQuery 1.x 和 2.x 中，只执行第一个函数（抛出错误的函数）会被执行到。此外，由于我们没有为 window.onerror 定义任何事件处理函数，所以控制台将输出消息：“Uncaught Error: An error”，而且程序的执行将中止。而在 jQuery 3 中，行为则完全不同的。你将在控制台中看到 “Failure
12、1” 和 “Success 2” 两条消息。异常将会被第一个失败回调处理，一旦被处理，则继续执行下面的成功函数。SVG 文档没有哪一个 jQuery 版本，包括 jQuery 3，正式支持 SVG 文档。不过事实上有很多方法是可以正常工作的，另外一些方法，比如操作类名的方法，已经在 jQuery 3 中进行了更新，因此也适用。因此，在未来的版本中，你应该可以放心使用诸如 addClass() 和 hasClass() 这样的方法来操作 SVG 文档了。已废弃、已移除的方法和属性除了前面说的改进，jQuery 也移除、废弃了一些特性。废弃bind(),unbind(),delegate()和un
13、delegate()jQuery 以前引入的 on() 方法提供了统一的访问接口，取代 bind()、delegate() 以及 live() 方法。与此同时，jQuery 用 off() 方法来取代 unbind()、undelegated() 及 die() 方法。bind()、delegate()、unbind() 和 undelegate() 今后不建议使用，但是并没有采取进一步的行动。jQuery 3 已经废弃这些方法，并计划在未来的版本（可能是 jQuery 4）中移除它们，要坚持在项目中使用 on() 和 off() 方法，这样你就不用担心未来版本的变更了。移除 load(),
14、unload() 和 error()方法jQuery 3 彻底抛弃了已经废弃的 load()、unload() 和 error() 方法。这些方法在很早以前（从 jQuery 1.8 开始）就已经被标记为废弃了，但仍一直存在。如果你正在使用的插件仍然依赖这些方法，那么升级到 jQuery 3 的时候，代码就会出错。因此，在升级过程中要注意。移除 context, support 和 selectorjQuery 3 彻底抛弃了已经废弃的 context、support 和 selector 属性。如前所述，如果项目中仍然使用着这些属性，或者某个插件仍在依赖这些属性，那么更新到 jQuery 3 时，代码就会出错。Bugs 修复jQuery 3 修复了以前版本中的一些重大 Bug。在下面的章节中，我将着重介绍其中两处，因为这两处会对你的编码产生重大影响width() 和 height()的返回值不再四舍五入jQuery 3 修复了 width()、height() 和其它相关方法中的一个 bug。这些方法的返回值将不再四舍五入取整到像素了，因为，这使得在某些情况下很难，对元素进行定位。要理解这个问题，让我们假设你有一个具有100像素的宽度的容器元素，这个元素有宽度均为三分之一（即 33.%）的3个子元素：
