jQuery 3.0 的新特性
1. jQuery 3.0 运行在严格模式下
当下几乎支持jQuery 3.0的浏览器都支持严格模式,该版本正是基于此进行编译发布的。
你的代码已经运行在非严格模式?不用担心,你无需重写。jQuery 3虽为严格模式,但并不强制在严格模式下运行你的代码。严格模式和非严格模式会愉快的共存~
2. For...of 循环
jQuery 3.0 支持 'for...of' 表达式,一种新型的for循环。这个新的迭代是ECMAScript 6的一部分。它给出一种更直接的遍历对象(如Arrays,Maps,和Sets)的方式。在jQuery 3.0中,for...of将替换$.each(...)。
var items = $('.random-class');
// old jQuery way
$.each(items, function(index, value) {
// do something
});
// ES6 way
for(let item of items) {
// do something
};
说明:for...of仅用于支持ES6的浏览器,或者你使用了JS编译器,比如Babel。
3. 动画接口:requestAnimationFrame( )
jQuery 3.0 使用requestAnimationFrame() 处理动画。它使动画运行起来更流畅、迅速,减少CPU密集型动画。但仅用于支持 它的浏览器。对于老的浏览器(如IE9),它会使用之前的API。
4. escapeSelector( ) 转义包含特殊意义的字符串
$.escapeSelector()这个新方法将转义CSS选择器中有特殊意义的字符或字符串。它适用于CSS中含有表意特殊的字符的类名或ID,如'.'或者':'。这种情况不常发生,不过一旦遇上,就可以轻松解决掉了。
//consider this is your element
<div id="abc.def"></div>
//above element can't be selected like this because the selector is parsed as "an element with id 'abc' that also has a class 'def'.
$('#abc.def')
//with jQuery 3.0 it can be selected like this
$( '#' + $.escapeSelector( 'abc.def' ) )
5. 对XSS攻击的附加防护
jQuery 3.0添加了额外安全层,用来防止 (XSS))攻击。使用时需要在 $.ajax() 和 $.get()方法中指定dataType: 'script'。即,当请求跨域脚本时,必须要声明这一点。
Flaws that allow these attacks to succeed are quite widespread and occur anywhere a web application uses input from a user within the output it generates without validating or encoding it.
XSS攻击是一类注入攻击,其中恶意脚本注入受信任站点。XSS攻击发生在攻击者使用web应用发送一段恶意代码(一般使用浏览器端脚本形式),给另一个不同的终端用户。web应用一旦使用了没有经过验证或编码的输入就会有问题。
6. 删除.ajax()中的特殊延迟方法
$.ajax()返回的jqXHR对象是一种 Deferred。先前,它有三种附加方法对应着参数对象success, error 和 complete。jQuery 3.0 删除了这些方法。现在可以使用 Deferred的标准方法done, fail和 always,或者使用新的 then 和 catch方法。
7. .get() 和 .post()的新签名
jQuery 3.0 为$.get() 和 $.post() 增添了新签名settings。增加settings参数,从而与$.ajax()的接口风格一致。settings是一个对象,包含很多属性,与提供给$.ajax()的参数格式一致。唯一不同是传相同的settings给$.get()和$.post(),method属性经常被忽略,而传给$.ajax()不会。
//HTTP Get
$.get([settings]) //HTTP Post
$.post([settings])
8. 支持SVG的类操作方法
从jQuery 3.0起, 开始完全支持SVG。jQuery操作CSS类名的方法,如.addClass() 和 .hasClass() 也可以用来支持SVG了。这意味着可以用jQuery在SVG里查找类,并且指定样式。
9. 简易的Show/Hide 逻辑
the .show(),.hide() and .toggle() methods will focus on inline styles rather than computed styles. The docs asserts that the most important result will be:
这是一项重要的变化,需要铭记于心。。从现在开始,这些方法.show(),.hide() 和 .toggle()将只为inline styles服务,不再为computed styles效力了。文档声明最重要的结果将是:
As a result, disconnected elements are no longer considered hidden unless they have inline display: none;, and therefore .toggle() will no longer differentiate them from connected elements as of jQuery 3.0.
因此,未关联元素不再被考虑hidden,除非它们有inline display: none; .toggle() 不再区分关联和未关联元素。。
如果想更好的理解新的show/hide,可参看jQuery团队的这张 表,或阅读这篇关于它的有趣的 Github discussion 。
10. .width ( ) 和 .height ( )支持小数
之前,jQuery对width(), height()及类似的方法提供的返回值是round类型(舍入取整),jQuery 3.0解决了这个bug,可以拿到更精确的结果,如float类型。这是非常好的进步,毕竟有时,用户的确需要更精准的数据来处理布局。
11. 废弃.bind()和.delegate()方法
jQuery 1.7 引入.on()方法来处理事件捕获。3.0中不建议使用.bind(), .unbind(), .delegate() 和 .undelegate()方法,并且这些方法在以后的版本中可能会被彻底删除。你可以放心大胆地在你的项目里使用on() 和 off()方法,不必担心它之后被删除~
jQuery 3.0 的新特性的更多相关文章
- Atitit jquery 1.4--v1.11 v1.12 v2.0 3.0 的新特性
Atitit jquery 1.4--v1.11 v1.12 v2.0 3.0 的新特性 1.1. Jquery1.12 jQuery 2.2 和 1.12 新版本发布 - OPEN资讯.h ...
- C#6.0的新特性之内插字符串
https://docs.microsoft.com/zh-cn/dotnet/csharp/language-reference/keywords/interpolated-strings C# 6 ...
- php5.3到php7.0.x新特性介绍
<?php /*php5.3*/ echo '<hr>'; const MYTT = 'aaa'; #print_r(get_defined_constants()); /* 5.4 ...
- paip.php 5.0 5.3 5.4 5.5 -6.0的新特性总结与比较
paip.php 5.0 5.3 5.4 5.5 -6.0的新特性总结与比较 PHP5的新特性 2 · 对象的参照过渡是默认的(default) 3 · 引入访问属性的限制 3 · 引入访问方法的限 ...
- NodeJS 框架 Express 从 3.0升级至4.0的新特性
NodeJS 框架 Express 从 3.0升级至4.0的新特性 [原文地址:√https://scotch.io/bar-talk/expressjs-4-0-new-features-and-u ...
- 相比于python2.6,python3.0的新特性。
这篇文章主要介绍了相比于python2.6,python3.0的新特性.更详细的介绍请参见python3.0的文档. Common Stumbling Blocks 本段简单的列出容易使人出错的变动. ...
- MySQL 8.0 InnoDB新特性
MySQL 8.0 InnoDB新特性 1.数据字典全部采用InnoDB引擎存储,支持DDL原子性.crash safe,metadata管理更完善 2.快速在线加新列(腾讯互娱DBA团队贡献) 3. ...
- [PHP] 从PHP 5.6.x 移植到 PHP 7.0.x新特性
从PHP 5.6.x 移植到 PHP 7.0.x 新特性: 1.标量类型声明 字符串(string), 整数 (int), 浮点数 (float), 布尔值 (bool),callable,array ...
- servlet3.0 的新特性之二注解代替了web.xml配置文件
servlet3.0 的新特性: 注解代替了 web.xml 文件 支持了对异步的处理 对上传文件的支持 1.注解代替了配置文件 1.删除了web.xml 文件 2. 在Servlet类上添加@Web ...
随机推荐
- ArrayList类的set()方法
ArrayList类的set()方法用于更新指定位置的内容,若内容是new出来的,则需要调用该set()方法:否则,不需要调用该set()方法,示例如下 User.java public class ...
- 今天遇到了不能创建mysql函数
今天用navicat 不能创建函数,查询了 MySQL函数不能创建,是未开启功能: mysql> show variables like '%func%'; +----------------- ...
- Laravel-admin 消息提醒、播放音频、点击跳转
jquery-toastr 消息提醒.播放音频.点击跳转 应用情景,有新的订单生成,后台进行消息提醒并播放音频(这里用到轮询简单实现):下面附代码 1.找到laravel-admin 中的 index ...
- 修改mac系统的host文件 (一)
hosts是本地预先配置的DNS数据,解析域名的时候首先试图从hosts文件获取,没有则从DNS服务器获取. 此文件的三个主要用途: 加快域名解析 方便局域网用户 一般局域网很少假设DNS服务器,访问 ...
- 后端查询树的通用SQL,具备懒加载功能
select t.org_id as key, --key值 t.org_name as title, --标题 t.has_sub as folder, --是否显示文件夹 t.has_sub as ...
- Docker ASPNetCore https 四步教你搭建一个网站
序 本教程需要有自己已经申请好的证书 ,没有证书请参照官方教程. Docker 就不多说了,咱只要知道怎么用先. 环境 core:asp net core 2.2 开发机:win10 LTS 服务器: ...
- qt tableview使用
Qt::CheckState checkSibling(QStandardItem * item); void treeItem_checkAllChild(QStandardItem * item, ...
- 如何使用Jedis操作redis
public class JredisTest { private static Jedis jedis = new Jedis("localhost", 6379); publi ...
- Python字符串、组合数据类型练习
一.Python字符串练习 1.http://news.gzcc.cn/html/2017/xiaoyuanxinwen_1027/8443.html 取得校园新闻的编号. (这个方法就很多了,一般方 ...
- 小程序API接口调用
1.在config.js中写入api接口及appkey 2.在HTTP.js中引入config.js,然后新建HTTP.js,在里进行wx.request的封装. 定义一个HTTP的类,来类里定义 ...