JQuery3 的新变化
1. for-of 循环
for-in 循环不被推荐遍历数组,forEach 循环不能中断,for-of 循环(ES6)则弥补了前两者的不足,又添加了更多拓展(比如能遍历字符串,DOM 元素等)
因此 jquery3 也加入了 for-of 循环的支持,即:
var $inputs = $('input'), i = 0;
for(var input of $inputs) {
input.id = 'input-' + i++;
}
注意:可见上例 for-of 中的 input 是DOM 元素而不是 jquery 元素
2. $.get 和 $.post 支持对象传参
// 以前我们通常这样写:
$.post('test.php', { name: 'David Guetta', age: 49 }, function (data) {
console.log(data);
}); // jQuery3 中可以这样写:
$.post({
url: 'test.php',
data: { name: 'David Guetta', age: 49 },
success: function (data) {
console.log(data);
}
});
这个变化其实我并未看懂为什么,只是比 $.ajax 少个 method:'POST' 吗
3. 动画改用 requestAnimationFrame 方法渲染
以往 jquery 使用的是 setInterval 每 16.7ms 更改元素属性值来进行动画渲染的,很容易动画卡顿和丢帧,
而 requestAnimationFrame 的优点已人人皆知,因此 jquery3 对动画进行了优化,使动画更流畅,和减少了 CPU 消耗。
4. unwrap() 添加可选参数 selector
<div class="wrap"><p></p></div>
<div><p></p></div>
// 移除 p 元素的 class="wrap" 的父元素
// 上面 html 中 只有第一个 div 会被移除
$('p').unwrap('.wrap');
5. :visible 和 :hidden
空标签和高度为零的元素也被认为是 :visible 了
<div></div>
<br>
<span></span>
// 在 jQuery1.x 中控制台输出 1
// 在 jQuery3 中控制台输出 3
console.log($('body :visible').length)
6. data() 的键格式改为了驼峰格式
严格遵守 Dataset API 规范,以后我们就该写 data-myProperty 而不是 data-my-property 了,否则用 jquery3 获取时就搞得很麻烦了。
7. 正式支持 SVG documents
获取 svg 元素,使用 addClass() 等方法都是可以的哟。
8. 废弃了 bind()、unbind()、delegate() 和 undelegate()
废弃是还存在于源码中但待到时机成熟就移除,所以事件绑定和解绑我们还是用 on() 和 off() 吧。
9. 移除了 load()、unload() 和 error() 方法
早在 1.8 时就被废弃了,因为实在被误解得太厉害,又实在不方便操作,我倒是举手欢迎移除的,但一直却没能找到可以替代该功能的方法。
10. 移除 context、support 和 selector 属性
去掉了 context 属性但还是可以选用 context() 方法呀。
selector 属性很鸡肋呀,我需要知道 body>div.xxx>p span 这条字符串干什么呢。
至于 $.support,官方说移除了, 但好像并没有呀,应该是我理解错了把。
11. width() 等保留为浮点数而非整数
以前获取到的 width() / height() 等都是整数,有时会造成一丢丢误差(比如 33.3333% 那样的),所以现在它将返回浮点数。
12. Deferred 对象
这个我完全没用过,而且也开始接触 Promise 了,所以忘记它也不失为一个办法。
JQuery3 的新变化的更多相关文章
- [转]Material Design Library 23.1.0的新变化与代码实战
Design Library出来已经快有一个月了,当时大概看了一下介绍这个新版本变化的译文,内容不多,给我印象最深的就是Percent lib.AppBarLayout 和NavigationView ...
- Material Design Library 23.1.0的新变化与代码实战
Design Library出来已经快有一个月了,当时大概看了一下介绍这个新版本变化的译文,内容不多,给我印象最深的就是Percent lib.AppBarLayout 和NavigationView ...
- 从iOS 11 UI Kit中谈谈iOS 11的新变化
北京时间9月20日凌晨1点,iOS 11终于迎来了正式版的推送,相信各位小伙伴已经在第一时间进行了升级.iOS 11毫无疑问是一次大规模的系统更新,UI.系统内核.锁屏等多方面都进行了不同程度的改进. ...
- Delphi XE7 GPS控件android下的新变化
Delphi XE7 GPS控件的Android新变化 GPS控件的Accuracy可以起作用了,Accuracy>0时: 1--100:ACCURACY_HIGH 101--500 ...
- 前端面试之HTML5的新变化
前端面试之HTML5的新变化 H5新增语义化标签 头部标签 <header> :头部标签 <nav> :导航标签 <article> :内容标签 <secti ...
- jQuery3的新特性
前言:自从react,vue等方便的新框架出现后,好多大公司已经摒弃了jquery,但是大部分的公司还在使用,并且jquery的版本还在一直更新中.jquery2.x版本将不再支持IE6/7/8浏览器 ...
- iOS8.3发布了Swift 1.2带来哪些新变化
苹果前几日在面向开发者推送iOS 8.3 Beta的同时,还发布了版本号为6D520o的Xcode 6.3 Beta,其中便包含了iOS 8.3 Beta和OS X v10.10 SDK,并进一步提升 ...
- [译] OpenStack Kilo 版本中 Neutron 的新变化
OpenStack Kilo 版本,OpenStack 这个开源项目的第11个版本,已经于2015年4月正式发布了.现在是个合适的时间来看看这个版本中Neutron到底发生了哪些变化了,以及引入了哪些 ...
- [译] OpenStack Liberty 版本中的53个新变化
一个新的秋季,一个新的OpenStack 版本.OpenStack 的第12个版本,Liberty,在10月15日如期交付,而且目前发行版本已经备好了.那么我们期望能从过去六个月时间的开发中获得些什么 ...
随机推荐
- plsql programming 07 使用数据
数据类型 char, Nchar varchar2, Nvarchar2 clob, Nclob number number(9, 2); -- 定点小数, 小数点左边7位, 右边2位 number ...
- 第一百六十四节,jQuery,常规选择器
jQuery,常规选择器 学习要点: 1.简单选择器 2.进阶选择器 3.高级选择器 jQuery 最核心的组成部分就是:选择器引擎.它继承了 CSS 的语法,可以对 DOM 元 素的标签名.属性名. ...
- Apache的下载以及安装
前言:生活,生下来,活下去 第一步:在浏览器的搜索栏输入:apache下载:显示如下,单机进入Apache的官网
- selenium的元素定位-iframe
# name = top-frame # 如果iframe有name属性 或 id属性则 可以直接在frame种填写 # 如果没有name和id属性 frame() 可以接受elementOBj el ...
- 【BZOJ2969】矩形粉刷 概率+容斥
[BZOJ2969]矩形粉刷 Description 为了庆祝新的一年到来,小M决定要粉刷一个大木板.大木板实际上是一个W*H的方阵.小M得到了一个神奇的工具,这个工具只需要指定方阵中两个格子,就可以 ...
- nginx发布的nginScript
nginx发布的nginScript 背景 2015年9月,nginx宣布支持类JavaScript语言.这意味着开发者可以更轻松.自由的控制全球最优秀的HTTP及反向代理服务器,并在此之上可以衍生出 ...
- 记录--java 分页 思路 (hibernate关键代码)
有时会脑袋蒙圈,记录下分页的思路 下面代码是hibernate的分页,其分页就是从第几条数据为起点,取几条数据.比如在mysql中的limit(5,10)取的就是第6条到第10条 在下面代码中的pag ...
- JavaScript函数setInterval()和setTimeout()正确的写法
一.常规写法 1.1 不传参数 function a (x, y) { var i = 0; var b = function(){ console.log((x * y) + (i++)); } r ...
- Django报:builtin_function_or_method' object is not iterable
def detail(request,hero_id): hero=models.HeroInfo.objects.get(id=hero_id) return render_to_response( ...
- python面向对象(二)
属性查找 类有两种属性:数据属性和函数属性 1. 类的数据属性是所有对象共享的 2. 类的函数属性是绑定给对象用的 class BeijingStudent: school='Beijing' ...