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 的新特性的更多相关文章

  1. 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 ...

  2. C#6.0的新特性之内插字符串

    https://docs.microsoft.com/zh-cn/dotnet/csharp/language-reference/keywords/interpolated-strings C# 6 ...

  3. php5.3到php7.0.x新特性介绍

    <?php /*php5.3*/ echo '<hr>'; const MYTT = 'aaa'; #print_r(get_defined_constants()); /* 5.4 ...

  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 · 引入访问方法的限 ...

  5. NodeJS 框架 Express 从 3.0升级至4.0的新特性

    NodeJS 框架 Express 从 3.0升级至4.0的新特性 [原文地址:√https://scotch.io/bar-talk/expressjs-4-0-new-features-and-u ...

  6. 相比于python2.6,python3.0的新特性。

    这篇文章主要介绍了相比于python2.6,python3.0的新特性.更详细的介绍请参见python3.0的文档. Common Stumbling Blocks 本段简单的列出容易使人出错的变动. ...

  7. MySQL 8.0 InnoDB新特性

    MySQL 8.0 InnoDB新特性 1.数据字典全部采用InnoDB引擎存储,支持DDL原子性.crash safe,metadata管理更完善 2.快速在线加新列(腾讯互娱DBA团队贡献) 3. ...

  8. [PHP] 从PHP 5.6.x 移植到 PHP 7.0.x新特性

    从PHP 5.6.x 移植到 PHP 7.0.x 新特性: 1.标量类型声明 字符串(string), 整数 (int), 浮点数 (float), 布尔值 (bool),callable,array ...

  9. servlet3.0 的新特性之二注解代替了web.xml配置文件

    servlet3.0 的新特性: 注解代替了 web.xml 文件 支持了对异步的处理 对上传文件的支持 1.注解代替了配置文件 1.删除了web.xml 文件 2. 在Servlet类上添加@Web ...

随机推荐

  1. PyCharm 格式化代码 常用快捷键

    ctrl+alt+L 一 常用快捷键 编辑类:Ctrl + D             复制选定的区域或行Ctrl + Y           删除选定的行Ctrl + Alt + L     代码格 ...

  2. go install

    go get使用时的附加参数 使用 go get 时可以配合附加参数显示更多的信息及实现特殊的下载和安装操作,详见下表所示. go get 使用时的附加参数 附加参数 备 注 -v 显示操作流程的日志 ...

  3. 输出单项链表中倒数第k个结点——牛客刷题

    题目描述: 输入一个单向链表,输出该链表中倒数第k个结点 输入.输出描述: 输入说明:1.链表结点个数 2.链表结点的值3.输入k的值 输出说明:第k个结点指针 题目分析: 假设链表长度为n,倒数第k ...

  4. Linux更改ext4根目录文件系统大小

    首先通过lsblk 查看一下文件系统情况 然后通过fdisk /dev/sda类似命令,打开对应的磁盘管理,然后: 删除所有磁盘分区 重新建立一个更大的分区. 保存退出 再次通过lsblk查看分区大小 ...

  5. 另类--kafka集群中jmx端口设置

    # 监控kafka集群 # 有一个问题,需要在kafka-server-start.sh文件中配置端口,有如下三种办法 # 第一种:复制并修改kafka目录,比如kafka-1,kafka-2,kaf ...

  6. [Jenkins]初次访问Jenkins,输入密码后,页面卡在空白界面一直未加载出内容_解决方案

    问题描述 安装Jenkins,初次访问Jenkins(http://localhost:8002,端口号根据各自设置而不同,本例是8002),输入Jenkins初始化的管理密码之后,浏览器中一直卡在空 ...

  7. 怎样使用 v-bind 绑定 html 标签的属性值?

    1. 在 Vue 中可是使用 v-bind 对 html 中的 属性 进行绑定, 如下所示, 我们想给这个 a 标签绑定一个 title 值: <!DOCTYPE html> <ht ...

  8. Tomcat中的Host和Engine级别的servlet容器

    这边文章主要介绍的是Host容器 和 Engine容器.如果你想在同一个Tomcat上部署运行多个Context容器的话,你就需要使用Host容器,从理论上来讲,如果你的Tomcat只想要部署一个Co ...

  9. 非常有用的pointer-events属性

    介绍 pointer-events是css3的一个属性,指定在什么情况下元素可以成为鼠标事件的target(包括鼠标的样式) 属性值 pointer-events属性有很多值,但是对于浏览器来说,只有 ...

  10. JS基础_相等运算符

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...