jQuery 3.0在日前发布了最终的全新版本。从2014年10月,jQuery团队对这个主要大版本进行维护开始,web开发者社区便一直在期待着这一刻的到来,终于在2016年6月他们迎来了这一个最终板www.itxdl.cn。

通过jQuery 3.0的版本更新说明,我们看到了一个保持着向后兼容的更轻便,更快速的jQuery。在本文中,我们将介绍一些令人眼前一亮的jQuery 3.0全新特性。

开始前的说明

如果你想要下载jQuery 3.0进行亲自实验,可以通过该页面进行下载。另外,升级指南和源代码也值得你一看。

如果你想要测试一下你的项目如何在jQuery 3.0中工作的,你可以尝试通过jQuery迁移插件来识别代码的兼容性问题,你也可以查看jQuery未来发展的时间表。

1. 移除旧的IE工作区

新的最终版最主要的目标是更加快速,更加时尚,因此,那些支持早于IE9版本的相关技术与工作区都被移除了。这意味着如果你想要或者需要支持IE6-8,你必须用回1.12版本,因为甚至是2.X版本都无法完整支持早于IE9的浏览器。

注意:在jQuery 3中还弃用了一些其它的功能。截止到2016年6月,升级指南还没有提供一个对于弃用功能的分组整理。因此,你如果想要了解弃用功能,可以通过ctrl+f键来进行搜索。

2. jQuery 3.0运行在Strict Mode下

大多数支持jQuery 3的浏览器都支持strict mode,而在本次更新中对此进行了规定。

虽然jQuery 3是写在strict mode中的,但是你需要了解的是你的代码并不需要运行在strict mode中,因此如果你想要把以前的代码迁移到jQuery 3,你不需要对已存在的jQuery代码进行重写。Strict和non-strict mode的JavaScript代码可以和谐共存。

这里有一些例外:某些版本的ASP.NET,因为strict mode的缘故,无法与jQuery 3兼容,

3. 引进for...of循环

jQuery 3支持for...of语句,这是由ECMAScript 6中新引进的一种for循环语句。这提供了对Arrays,Maps和Sets这样的可迭代对象一种更直接的遍历方法。

在jQuery中,for...of循环可以取代以前的$.each(...)语法,并且更容易通过jQuery的元素集合进行循环。

注意:for...of只能在支持ECMAScript 6的环境下或者使用Babel这样的JavaScript编译器下工作。

4. 动画方面采用新的API

jQuery 3使用requestAnimationFrame() API来执行动画,使动画运行得更加顺畅、快速。新的API只用于支持它的浏览器,对于那些更老的浏览器(如IE9)jQuery使用先前的API来作为显示动画的后备方案。

5. 对包含特殊含义的字符串提供转义的新方法

新的jQuery.escapeSelector()提供了对在CSS中存在特殊含义的字符串或字符进行转义的方法,该方法可使这些字符串或字符能够继续用于jQuery选择器中,而无需对那些无法进行正确理解的JavaScript解释器进行转义。

这个示例可以让你更好的了解这个全新的方法:

举个例子,页面中某个ID为“abc.def”的元素由于选择器将其解析为ID为“abc”且包含一个名为“def”的类的对象,而无法被$( "#abc.def" )选定。但是它可以由 $( "#" + $.escapeSelector( "abc.def" ) )来进行选定。

我无法确定发生中情况的频率,但是假如你碰到过这种类似的情况,这无疑给了你一个解决该问题的简单方法。

6. 类操作方法支持SVG

不幸的是,jQuery 3现在还无法完整的支持SVG,但是对于操作CSS类名称的jQuery方法,如.addClass()和.hasClass()现在可以将SVG文档作为目标。这意味着你可以修改(添加、删除、切换)或者查找SVG(可缩放矢量图形)下的jQuery类,然后使用CSS的类样式。

7. 延迟对象现在与JS Promises兼容

JavaScript Promises,用于异步计算的对象,现在在ECMAScript 6中已经被标准化;它们的运行状况和特性的详细说明参见Promises/A+标准。

在jQuery 3中,延迟对象已经与新的Promises/A+标准相兼容,延迟对象已经成为让创建回调队列成为可能的可链对象(chainable objects)。

新的特性改变了异步回调函数执行过程,Promises允许开发者编写在逻辑上与同步代码更接近的异步代码。

8. jQuery.when()对于多种参数的不同解读

$.when()提供了执行回调函数的一种方法,它成为了jQuery 1.5之后的一部分。这个方法非常灵活,它适用于零参数,也适用于一个或者多个作为参数的对象。

jQuery 3改变了当包含$.then()方法时对$.when()中参数的解读方法,你可以对$.when()进行额外的参数回调。

在jQuery 3中,如果你在$.when()中的then()方法内增加一个输入参数,该参数将会被解释成一个可与Promise兼容的"thenable"。

这意味着 $.when方法能够接收更加宽广的输入范围,比如原生的ES6 Promises和Bluebird Promises,这也使得编写更复杂的异步回调成为了可能。

9. 新的显示/隐藏逻辑

为了增加响应式设计的兼容性,与元素显示和隐藏的代码在jQuery 3中进行了更新。

从现在开始,.show()、.hide()和.toggle()方法将会以内联样式为重点取代以前的计算样式,这种方式能够更尊重样式列表的改变。

新的代码尽可能的尊重样式列表中所呈现的数值,这意味着CSS规则可根据事件(如设备重新定位和窗口尺寸调整)进行动态改变。

这个说明文件申明了最重要的结果就是:

“作为结果,断开连接的元素除非指定了内联display: none,否则将不再认定为是隐藏的。因此,在jQuery 3.0中,.toggle()不再对断开连接元素与已连接元素进行区分。”

如果你想要更好的了解关于全新的显示/隐藏逻辑,这个Github discussion会对你有帮助。jQuery开发者还发布了Google文档表来展示在不同用例下新规则的运转。

10. 对于防止XSS攻击的额外保护

jQuery 3增加一个额外的安全层用户用于防备跨站点脚本(XSS)攻击,它需要开发者指定$.ajax()和$.get()方法中的选项为dataType: "script"。

换言之,如果你想要执行跨站点的脚本请求,你必须在这些方法中作出这样的声明。

新的改变对于当“远程站点传递非脚本内容之后又提供有恶意脚本的服务内容”的情况是非常有效的。这个变化不会影响$.getScript()方法,因为它明确地设置了dataType: "script"选项。

jQuery 3.0最终版发布,十大新特性眼前一亮的更多相关文章

  1. Java9发布回顾Java 8的十大新特性

    java9已经在北京时间9月22日正式发布,开发者可以在oracle jdk官网上下载到最新的jdk9. 今天,我们先来一起复习一下2014年发布的Java 8的十大新特性.先来喝杯java~~~ 按 ...

  2. 有史来最大改变 Android 5.0十大新特性

    有史来最大改变 Android 5.0十大新特性 2014.10.16 14:51:31 来源:腾讯数码作者:腾讯数码 ( 0 条评论 )   距离Android系统上一次重大更新不到一年的时间,谷歌 ...

  3. Android 5.0(棒棒糖))十大新特性

    Android 5.0(棒棒糖))十大新特性 1. 全新Material Design设计风格 Android Lollipop全新的设计语言是受到了多种因素影响,是一种大胆的平面化创新.换句话说,谷 ...

  4. Java9都快发布了,Java8的十大新特性你了解多少呢?

    Java 9预计将于今年9月份发布,这是否会是一次里程碑式的版本,我们拭目以待.今天,我们先来复习一下2014年发布的Java 8的十大新特性. Java 8可谓是自Java 5以来最具革命性的版本了 ...

  5. ES6的十大新特性(转)

    add by zhj: 该文章是由国外一哥们写的,由腾讯前端团队翻译,图片中的妹子长得挺好看的,很养眼,嘿嘿.我目前在学习ES6,这篇文章把ES6的 几个主要新特性进行了归纳总结,犹如脑图一般,让人看 ...

  6. Java基础学习总结(33)——Java8 十大新特性详解

    Java8 十大新特性详解 本教程将Java8的新特新逐一列出,并将使用简单的代码示例来指导你如何使用默认接口方法,lambda表达式,方法引用以及多重Annotation,之后你将会学到最新的API ...

  7. java8的十大新特性

    推荐学习的博客: http://blog.csdn.net/renfufei/article/details/24600507/-------讲解的非常通俗易懂 http://blog.csdn.ne ...

  8. MySQL 8.0的十大新特性

    今天,让我们看一下MySQL8.0提升数据库管理员工作效率的十大改进. 从一大堆特性你们找出十点并不太容易,以下是这十大特性: 1.临时表的改进 2.持续的全局变量 3.取消默认MyISAM系统表 4 ...

  9. [Android 新特性] 有史来最大改变 Android 5.0十大新特性

    距离Android系统上一次重大更新不到一年的时间,谷歌再一次从KitKat升级到了Lollipop,而两次都使用糖果来命名,营销的目的显露无 遗.当我们首次看到Android 5.0 Lollipo ...

随机推荐

  1. scrapy安装的问题

    Found existing installation: six 1.4.1 DEPRECATION: Uninstalling a distutils installed project (six) ...

  2. ubuntu14.04 安装Jenkins

    wget -q -O - http://pkg.jenkins-ci.org/debian/jenkins-ci.org.key | sudo apt-key add - sudo sh -c 'ec ...

  3. Spring / Hibernate 应用性能调优

    来源:ImportNew - 陈晓舜 对大部分典型的Spring/Hibernate企业应用来说,应用的性能大部分由持久层的性能决定. 这篇文章会重温一下怎么去确认我们的应用是否是”数据库依赖(dat ...

  4. dojo实现省份地市级联---省份数据源

    province.json: { "identifier": "id", "label": "name", " ...

  5. java中JDBC报错(一)

    java中JDBC报错(一) 1.具体报错如下 com.mysql.jdbc.MySqlDataTruncation:Data truncation:Data too long for column ...

  6. Linux显示本地端的文件系统

    Linux显示本地端的文件系统 youhaidong@youhaidong-ThinkPad-Edge-E545:~$ df -l 文件系统 1K-blocks 已用 可用 已用% 挂载点 /dev/ ...

  7. 在visual studio 2017中配置Qt

    简述 这两天因为软件工程课要用vs2017写一个C++的GUI界面,就打算学习Qt,但是vs2017配置起Qt来不像vs2013,15那么简单,而且现在网上对于vs2017配置Qt的教程很少,也不详细 ...

  8. springtest-junit-jidi--测试接口

    一,问题分析 假如在一个项目中要测试一个接口,但是这个项目没有对外开放url地址,话句话就是说浏览器访问不了里面的资源,自己造的数据不能测试接口,那么只能等别人来调用自己的接口,而且自己也不能测试,假 ...

  9. TP5 数组分页

    需要 use think\Page; 我这个是 Page是从tp3.2的移到5.0来用的,如果你的里面没有这个也可以移动过来 PHP代码: $page= $this->request->p ...

  10. 【转载】Apache Spark Jobs 性能调优(二)

    调试资源分配   Spark 的用户邮件邮件列表中经常会出现 "我有一个500个节点的集群,为什么但是我的应用一次只有两个 task 在执行",鉴于 Spark 控制资源使用的参数 ...