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 ...
随机推荐
- layui-dTree显示不出来且前台报错
layui-dTree显示不出来且前台报错 Cannot read property 'parents' of null 检查过后发现layer并没有使用到,找不到任何办法解决. 最后删除了respo ...
- PHP+jQuery.photoClip.js支持手势的图片裁剪上传实例
PHP+jQuery.photoClip.js支持手势的图片裁剪上传实例,在手机上双指捏合为缩放,双指旋转可根据旋转方向每次旋转90度,在电脑上鼠标滚轮为缩放,双击则顺时针旋转90度. 下面让我们来看 ...
- leecode 刷题(32)-- 链表的中间节点
leecode 刷题(32)-- 链表的中间节点 描述: 给定一个带有头结点 head 的非空单链表,返回链表的中间结点. 如果有两个中间结点,则返回第二个中间结点. 示例 1: 输入:[1,2,3, ...
- 怎样安装 cnpm 并切换到淘宝镜像?
如果不使用 vpn , 在国内直接使用 npm 的官方镜像会很慢,这里推荐使用淘宝 NPM 镜像.淘宝 NPM 镜像是一个完整的 npmjs.org 镜像,可以用此代替官方版本(只读). 操作方法如下 ...
- centos配置LVS
LVS有三种工作模式:NAT, TUN, DR. DR是三种工作模式中性能最高的,TUN次之. 本文记录LVS/TUN和LVS/DR工作模式的配置过程. 环境: 三台CentOS 7 x64 虚拟机 ...
- R语言学习笔记:读取前n行数据
常规读取 一般我们读取文件时都会读取全部的文件然后再进行操作,因为R是基于内存进行计算的. data <- read.table("C:\\Users\\Hider\\Desktop\ ...
- HTML之美化盒子
1. 美化盒子 1.1. 美化文本 1.1.1. 字体大小[font-size]: 字符框的高度,可继承,默认值medium,16px.基准字号:浏览器设置的默认字体大小,通 ...
- 第一章 PHP mySQL
一,服务器环境搭建 1-1.Apache服务器.(端口号定义,http协议,开启和关闭) 服务器: 我们在浏览器浏览网页的时候,在地址栏中都会产生一个url.通过这个url,浏览器从互联网中找到一个网 ...
- 第二章· MySQL体系结构管理
一.客户端与服务器模型  1.mysql是一个典型的C/S服务结构 1.1 mysql自带的客户端程序(/application/mysql/bin) mysql mysqladmin mysqld ...
- Lua游戏逆向及破解方法介绍
Lua游戏逆向及破解方法介绍 背景介绍 随着手游的发展,越来越多的Cocos-lua端游开发者转移到手游平台.Lua脚本编写逻辑的手游也是越来越多,如梦幻西游.刀塔传奇.开心消消乐.游龙英雄.奇迹 ...