jQuery 3.0 升级指南 -- JavaScript -- IT技术博客大学习 -- 共学习共进步！

您现在的位置：首页 --> JavaScript --> jQuery 3.0 升级指南

jQuery 3.0 升级指南

浏览:838次出处信息

概述

在3.0主版本中，jQuery Core团队对API进行更改及清理，并修复某些代码更改引起的bug。这包括删除以前弃用的公开API，更改或删除未记录的API，并更改现有API的记录或未记录的行为用于特定输入。

浏览器支持

jQuery 3.0 支持以下浏览器：

Internet Explorer: 9+
Chrome, Edge, Firefox, Safari: 当前版本和当前版本 - 1
Opera: 当前版本
Safari Mobile iOS: 7+
Android 4.0+

jQuery团队策略是主版本更新只针对这些浏览器，所以这个浏览器列表至少支持到jQuery 4。

jQuery Migrate 插件

与jQuery 1.9 / 2.0中的主要更改一样，我们已经创建了一个新版本的jQuery Migrate插件,以简化旧代码迁移到3.0版本。我们强烈建议您使用这个插件作为升级工具，它将给出可能影响您的代码的关于大多数主要更改的具体建议。

jQuery Migrate插件 3.0 版本，不会警告或恢复以前主版本更改（如jQuery 1.9 / 2.0）中删除的行为。使用以下步骤从 1.11.0 或 2.1.0 之前的jQuery版本升级到3.0新版本：

将页面上的jQuery版本升级到最新的1.x或2.x版本（目前为1.12.3或2.2.3）(愚人码头注：3.0之前的最新版本)。
将未压缩的jQuery Migrate 1.x插件添加到页面。
可选但是建议，更新正在使用的任何插件，因为最新版本通常是与最新版本的jQuery是兼容的。
测试页面并解决出现在控制台上的任何警告，使用JQMIGRATE 1.x警告文档作为指南。
删除jQuery Migrate 1.x插件，并确保该页面在只使用最新的jQuery 1.x / 2.x的情况下，更新的jQuery代码能继续正常工作。
将页面上的jQuery版本升级到最新的3.0版本（目前为3.0.0 ）(愚人码头注：目前最新版本为3.1.1)，并将未压缩的jQuery Migrate 3.x插件添加到页面。
测试页面并解决控制台上显示的任何警告，使用JQMIGRATE 3.x警告文档作为指南。如果插件报错，向第三方插件作者报告插件中的错误。
删除jQuery Migrate 3.x插件，并确保该页面在只使用最新的jQuery 3.x的情况下，能继续正常工作。

不支持在同一页面上同时运行Migrate 1.x和Migrate 3.x。

当使用特定的过时和/或移除的特征时，Migrate插件的未压缩开发版本会在控制台日志中输出以警告。在查找和修复现有jQuery代码和插件中的问题的时候，它很有用，可以作为迁移调试工具。

Migrate插件的压缩版本不会生成任何警告，然而它发出一个单独的控制台消息，告诉我们它已经被安装引用，以简化调试。jQuery 3.0或更高版本的生产站点上可以根据自己的需要使用Migrate插件，但对于旧的不兼容的jQuery代码或插件也必须使用。理想情况下，这只是作为一个短期解决方案，因为恢复旧的行为可能会导致与预期新行为的新jQuery代码的冲突。

重要变更摘要

jQuery作为一个广泛使用的类库，团队通常很难知道在发布之前哪些更改可能会影响到开发人员。尽管这份名单很长，我们认为大多数是边缘案例。许多jQuery项目应该能够运行3.0版本，如果有问题的话，一般只要做轻微的更改。

通过其组件类别列出更改，并以前缀描述，以帮助您了解其影响：

更改：此更改可能会影响现有代码，因为它以某种方式改变了API。大多数时候，影响仅针对特定边缘情况。
功能：此更改是添加API，并且在大多数情况下不应影响现有代码。但是，新功能可能与现有代码相互影响。
已弃用：此功能或API仍然存在于jQuery 3.0中，但不建议使用。它可能会在未来的主版本更新中删除。

请记住，上述的jQuery Migrate插件可以检测和警告这些更改，以便它们可以在现有的代码中修复。

有关所有代码更改的完整详细列表，请参阅 jQuery Core问题跟踪器中的3.0规划或版本差异。

Ajax

更改：特殊情况的Deferred方法从jQuery.ajax中删除

从jQuery.ajax()返回的jqXHR对象是一个jQuery Deferred,并且历史上有三个名称与参数对象的success, error, 和 complete 相匹配的额外的方法。这经常让人困惑,返回的对象应该像Deferred一样处理。从jQuery 3.0开始，这些方法已被删除。作为替代，使用Deferred标准的done，fail和always方法，或者使用新的符合Promises/A+规范的then 和 catch 方法。

注意,这对通过options对象传递的同名的ajax回调根本没有任何影响，它们继续存在并且不会被弃用。这只影响jqXHR方法。

https://github.com/jquery/jquery/issues/2084

更改：跨域脚本请求必须声明

通过jQuery.ajax()或jQuery.get()请求跨域脚本的时候,您现在必须在选项中显式指定dataType: "script"。这是为了防止远程站点提供非脚本内容攻击的可能性，但稍后决定提供具有恶意意图的脚本。由于jQuery.getScript()显式设置dataType: "script"，所以它不受此更改的影响。

更改：URL中的 hash 保存在jQuery.ajax()调用中

jQuery.ajax()方法不再自动删除URL中提供的 hash 值，并将完整的URL发送传输（xhr，script，jsonp或自定义传输）。如果服务器端无法处理URL上的hash，请在发送请求之前删除它。

https://github.com/jquery/jquery/issues/1732

功能：jQuery.get()和jQuery.post()增加新的签名

jQuery 3 通过添加settings参数,为jQuery.get()和jQuery.post()函数添加了一个新的签名。它是一个对象，可以拥有许多属性,它和你提供给jQuery.ajax( [settings ] )的settings 对象基本相同(愚人码头注： type选项将自动设置为GET；另：实际上这个签名的添加版本为1.12/2.2)。

https://github.com/jquery/jquery/issues/1986

属性(Attribute)

更改：`.removeAttr()`不再设置 property（特性值）为 false

在jQuery 3.0之前，在布尔属性（例如checked, selected, 或者 readonly）上使用.removeAttr()方法，将会设置其名称相应的 property（特性）为false。此行为在Internet Explorer的旧版本上是必需的，但对于现代浏览器是不正确
因为属性（attribute）表示初始值，并且 property（特性）表示当前（动态）值。

在DOM元素上使用.removeAttr( "checked" )几乎总是错误。唯一可能有用的情况是，DOM以后要被序列化回HTML字符串。在所有其他情况下，使用.prop( "checked", false )代替。

https://github.com/jquery/jquery/issues/1759

https://github.com/jquery/jquery/issues/2913

更改：多选下拉框（select-multiple）不选择选项将返回空数组

在jQuery 3.0之前，在未选择任何选项的 <select multiple> 元素上调用.val()返回null。这是不方便的，因为如果选择至少一个选项，返回值将是一个数组。此外，如果所有选项都被禁用，jQuery返回值将是一个空数组。为了提高一致性，无选项选择的情况下现在返回一个空数组。

https://github.com/jquery/jquery/issues/2562

功能：SVG文档支持类名（class）操作

SVG从来没有被jQuery完全支持，并且这点在jQuery 3中没有改变。尽管如此，许多jQuery方法也可以在SVG文档上使用。从jQuery 3开始，操作类名的方法，例如 .addClass() 和 .hasClass()，支持SVG。

https://github.com/jquery/jquery/issues/2199

弃用：不带参数的 `.toggleClass()` 和 `.toggleClass( Boolean )`

虽然文档记录了这两种情况的签名，其实际行为从未完全定义。这个不明确的行为现在已被废弃，因此不会被记录。您可能会发现您不小心使用了该功能，因为.toggleClass( undefined )的行为和没有参数的调用是相同的，即使它是无效的输入。

回调（ Callback ）

功能：SVG文档支持类名（class）操作

如果一个回调对象有一个处理函数在.fire()之后调用.lock()方法，它只阻止未来执行回调列表并且不立即中止当前列表的执行。要停止当前执行，请使用stopOnFalse选项。

https://github.com/jquery/jquery/issues/1990

Core

更改：在严格模式下运行jQuery 3.0

现在大多数浏览器都支持通过jQuery 3.0使用”use strict”，jQuery 就是用这个指令构建的。您的代码不需要在严格模式下运行，所以大多数现有代码不需要做任何修改。我们三年前遇到的一个案件是ASP.NET 4.0使用arguments.caller.callee在其__doPostBack()方法中尝试跟踪调用堆栈。如果你仍然使用仍然这样做的ASP.NET版本，推荐继续使用jQuery 2.x或更早版本。现代浏览器通过error.stack支持堆栈跟踪,所以它不应该有必要检查arguments.caller.callee。

https://github.com/jquery/jquery/pull/3061

https://bugs.jquery.com/ticket/13335

更改：文档就绪（document-ready）处理程序现在是异步的

在jQuery中，自jQuery 1.6以来,document-ready 处理由jQuery.Deferred实现提供支持。作为符合 Promises/A+ 规范的jQuery 3.0 队列的一部分，document-ready 处理程序被异步调用，即使是文档当前已经准备就绪，再添加处理程序。这样提供了代码执行顺序的一致性，与文档是否准备就绪无关。例如，考虑这个代码：

JavaScript代码:
$(function(){
   console.log("ready");
});
console.log("outside ready");

在jQuery 3.0中，将总是log “outside ready”，紧接着是”ready”，不管文档在执行时候是否准备就绪。早期版本可以按任一顺序log消息。

由于处理程序是彼此独立地执行，所以在一个document-ready处理程序中的异常或失败不会阻止其他document-ready处理程序运行。

如果是自定义构建的jQuery，排除了deferred模块，有一种可供选择的document-ready替代品。这个实现支持jQuery.ready promise,但不是一个jQuery.Deferred对象,所以它应该只能通过jQuery.when()使用。

https://github.com/jquery/jquery/issues/1823

https://github.com/jquery/jquery/pull/2891

更改： jQuery.isNumeric() 和自定义的`.toString()`

jQuery.isNumeric()方法旨在与原始数字,以及可以强制转换为有限数字的字符串一起使用。尤其是，它不再尝试从对象的.toString()方法上获取数字。需要对其他数字进行专门检查的用户可以创建自己的验证函数。

https://github.com/jquery/jquery/issues/2662

更改：弃用`.context` 并且移除`.selector`属性

这些属性在jQuery 1.9中已弃用，因为它们只用于过时的.live()方法,并且从未准确地表示当前集合的上下文或选择器。

https://github.com/jquery/jquery/issues/1908

更改：文档中从未记录的内部方法不再暴露

3.0版本从视图中删除了几个方法，意图是私有方法，并且文档中从未记录过：

jQuery.swap
jQuery.buildFragment
jQuery.domManip

https://github.com/jquery/jquery/issues/2224

https://github.com/jquery/jquery/issues/2225

更改：空集合上返回 `undefined` 值

除了少数例外，任何有返回值的jQuery方法在空的jQuery集合上应该返回undefined，以符合我们的API指南。以下API已更改,以符合此规则：

尺寸方法: .width(), .height(), .innerWidth(), .innerHeight(), .outerWidth(), 和 .outerHeight()
位置方法: .offsetTop() 和 .offsetLeft()

以前，这些方法对于空集合返回null而不是undefined。

https://github.com/jquery/jquery/issues/2319

功能：`for...of`循环可以用于jQuery集合

jQuery 3.0支持ES2015中引入的for...of循环。它允许循环迭代对象，包括Array, Map, 和 Set。当使用这个循环时，获得的值是jQuery集合的DOM元素，一次一个。请注意，使用for...of循环请注意支持的环境，支持ES2015或如Babel转换器。这里是一个例子：

JavaScript代码:
var elems = $(".someclass");
// 经典的 jQuery 方式
$.each(function(i, elem){
// 通过 elem (或 "this" 对象)工作
});
// 较漂亮的 ES2015 方式
for( let elem of elems ){
// 通过 elem工作
}

https://github.com/jquery/jquery/issues/1693

功能：`jQuery.ready` promise 正式被支持

从jQuery版本1.8开始,jQuery.ready已经作为一个类似 promise 的对象被使用（”thenable”在Promise中的术语）。从jQuery 3.0开始，这个对象通过jQuery.when或原生的Promise.resolve()被支持。不要假设这个对象是一个jQuery Deferred或一些其他类型的promise对象，例如原生的Promise。典型用法如下所示：

JavaScript代码:
$.when( $.ready, $.getScript("optional.js")).then(function(){
// 当 document 准备就绪，并且 optional.js 已经加载或运行
}).catch(function(){
// 一个错误发送时触发
});

https://github.com/jquery/api.jquery.com/pull/530

弃用：`jQuery.unique()`, 重命名为 `jQuery.uniqueSort()`

jQuery.unique()方法已重命名为jQuery.uniqueSort()，以使其行为更容易理解。这里没有改变其功能，只有重命名。

弃用：`jQuery.parseJSON()`

由于jQuery 3.0支持的所有浏览器都支持原生的JSON.parse()方法，因此我们不推荐使用jQuery.parseJSON()。

https://github.com/jquery/jquery/issues/2800

弃用：除了 `jQuery(function)` 以外的 document-ready 处理器

由于历史兼容性问题，有多种方式设置 document-ready 处理程序。以下所有方式都是等效的，并在 document-ready 时调用函数fn：

JavaScript代码:
$(fn);
$().ready(fn);
$(document).ready(fn);
$("selector").ready(fn);

从jQuery 3.0开始，添加 document-ready 处理程序的推荐方式是第一个方法，$(fn)。如事件部分所述，$(document).on("ready", fn)事件形式具有略微不同的语义并在jQuery 3.0中被删除。

Data

更改：.data()名称包含中划线

从jQuery 3.0开始，所有 data 名称都以驼峰拼写方式（例如，clickCount）存储在jQuery内部的数据对象中,而不是中划线形式（例如,click-count）。将中划线名称转换为驼峰拼写法的方式，这与标准DOM在CSS和 data 属性中的JavaScript名称是一致的。

一般来说，当设置或获取指定数据项时，例如 .data("right-aligned")，中划线形式在jQuery 3.0中仍然能够工作，但是如果取回data对象，它将具有驼峰拼写法的形式的 data 项（rightAligned）。3.0中的主要区别是当你在data对象上使用中划线形式的名称时，不要使用.data()API 来获取或设置他们。

例如：

JavaScript代码:
var $div = $("<div />");
$div.data("clickCount",2);
$div.data("clickCount");// 2
$div.data("click-count",3);
$div.data("clickCount");// 3
$div.data("click-count");// 3
var allData = $div.data();
allData.clickCount;// 3
allData["click-count"];// undefined
allData["click-count"]=14;
$div.data("click-count");// 3, 不是 14 ，但是在jQuery 2.x中，返回14
allData.clickCount;// 3
allData["click-count"];// 14

https://github.com/jquery/jquery/issues/2070

https://github.com/jquery/jquery/issues/2257

https://github.com/jquery/jquery/issues/1751

Deferred

更改和功能：jQuery.Deferred 现在兼容 Promises/A+

Deferred已更新，兼容了 Promises/A+ 和 ES2015（也称为 ES6）Promise ，这个变化带来重大影响。

https://github.com/jquery/jquery/issues/1722

https://github.com/jquery/jquery/issues/2102

Resolution

.resolve，.reject和.notify现在设置undefined的上下文,而不是使用与它们相关联的Deferred对象的promise。要设置显式上下文，使用.resolveWith，.rejectWith和.notifyWith。

https://github.com/jquery/jquery/issues/3060

Callback exit

对.then()方法进行了重大更改。尤其是，在.then()回调中抛出的任何异常现在都被捕获并转换为 rejection(拒绝) 值，并且从rejection(拒绝)处理程序返回的任何 non-thenable 值都会变为 fulfillment 值。我们强烈建议您在 promise 链的末尾添加一个.catch()方法（3.0中新增），以避免出现难以调试的问题。您可能会遇到这种新行为,最可能的地方是使用由jQuery.ajax()生成的 Deferred，因为返回的jQXHR对象是jQuery.Deferred的超集。

在jQuery 1.x和2.x中，回调函数中的未捕获异常会停止代码执行。抛出的异常会冒泡直到它在try/catch中被捕获，或冒泡到window并通过 window.onerror触发。

例如，考虑下面这个代码使用 Promises/A+ 新标准的行为：

JavaScript代码:
$.ajax("/status")
.then(function(data){
      whoops();
// 控制台显示："jQuery.Deferred exception: whoops is not a function"
// 在这个函数中没有代码会继续执行
})
.catch(function(arg){
// 此代码在上面的错误之后执行
// arg 是一个 Error 对象, "whoops is not a function"
});

将其与旧版本的Deferred方法进行比较：

JavaScript代码:
$.ajax("/status")
.done(function(data){
      whoops();
// 控制台显示： "whoops is not a function"
// 在这个函数中没有代码会继续执行
})
.fail(function(arg){
// 此代码不执行，因为异常未捕获
});

注意,当在一个Deferred和JavaScript异常发生时,jQuery会向控制台记录一条消息。这些消息采用jQuery.Deferred exception: (error message)形式。如果你不希望控制台输出任何这样的异常，请将jQuery.Deferred.exceptionHook设置为undefined。如果您需要通过这种方式进一步找到或者报告错误的帮助，请在开发期间使用jquery-deferred-reporter插件来获取堆栈跟踪。

https://github.com/jquery/jquery/issues/2736

Callback invocation

Promises / A +规范说, promises 总是使用单个值来解析,并且处理程序不在this上下文中调用，而jQuery Deferreds有时会将上下文和/或多个值传递给它们的处理程序。但在大多数情况下，第一个参数是这些值中最重要的。如果你将其他Promises/A+实现与jQuery混合使用，那么您只能在处理程序中接收到单个参数。为了保持现有代码的完全兼容性，建议只使用jQuery Deferred 并切换到较旧的.done()和 .fail()方法，因为他们保留所有向后兼容的行为：

JavaScript代码:
// 典型的 .then() 旧用法，不兼容Promises/A+
$.ajax("url").then(
// success
function( data, textStatus, jqXHR ){/* code */},
// error
function( jqXHR, textStatus, errorThrown ){/* code */}
);
 
// 这样重写，以便保持先前的行为
$.ajax("url")
// success
.done(function( data, textStatus, jqXHR ){/* code */})
// error
.fail(function( jqXHR, textStatus, errorThrown ){/* code */});

另一种符合Promises/A+规范的行为变更是，Deferred .then()回调总是异步调用。以前，如果将 .then()回调添加到已经 resolved 或 rejected 的 Deferred 上，该回调将立即并同步运行。

向下兼容性

Deferred 的方法（如.done(), .fail(), 和 .pipe() ）保留了以前的行为，因此不兼容 Promises/A+ 。如果需要同步 resolution，不希望将异常转换为 rejection 值，或者 rejection 回调返回转换为fulfillment值，或者想要抛出的错误冒泡到触发函数的外部，您可以使用这些方法，而不是.then()和.catch()。

更改和功能：jQuery.when()的参数

jQuery.when现在能给解析then方法输入的任何参数，作为Promise兼容的“thenable”。这允许更大范围的输入，包括原生的ES6 Promises和Bluebird promises。

此外，现在可以更清楚的识别，多参数调用jQuery.when和单参数或无参数调用之间的区别。多参数调用的行为类似于Promise.all，将 fulfillment 值聚合到 fulfillment 数组中（具有jQuery特有的增强功能，也集合 fulfillment 上下文和支持多值的fulfillments），或者拒收第一个rejection值。单参数和无参数调用的行为类似于Promise.resolve，返回一个Deferred，相同地解析为 thenable 或类似 Promise-like 输入，或满足其 non-Promise 输入（如适用）。从jQuery 3.0开始，这两个都返回一个新的Deferred（以前版本在使用单个Deferred输入调用时，不会创建新的Deferred）。

https://github.com/jquery/jquery/issues/2018

https://github.com/jquery/jquery/issues/2546

https://github.com/jquery/jquery/issues/3029

更改：jQuery.when() 的进度通知

从jQuery 3.0开始，jQuery.when() 方法不再传递进度通知从输入Deferred到输出Deferred。进度消息不是 Promises/A+ 规范的一部分，并且jQuery.when()中进度通知的行为之前就没有出现在jQuery API文档中。

https://github.com/jquery/jquery/issues/2710

尺寸大小

更改： .width(), .height(), .css(“width”), 和 .css(“height”)能够返回非整数值

在3.0版之前，jQuery使用DOM的offsetWidth和offsetHeight属性来确定元素的尺寸大小(宽高)，并且这些属性总是返回整数。使用jQuery 3.0，我们通过DOM getBoundingClientRect API来获得更精确的值，并且这些值可以不是整数。如果你的代码总是期望尺寸大小(宽高)为整数，它可能需要调整处理返回值的精度。

https://github.com/jquery/jquery/issues/1724

更改： window上的.outerWidth() 或 .outerHeight() 包含滚动条的宽/高

调用$(window).width()返回“内容宽度”不包括任何滚动条（因为内容超过元素的高度而造成浏览器自动添加的滚动条）。这个不同于用于CSS媒体查询的宽度，其包括滚动条的宽度。为了提供等同于CSS媒体查询概念的宽度，$(window).outerWidth()方法现在返回的宽度值包括滚动条宽度。这相当于DOM属性window.innerWidth。.outerHeight()同样适用。

https://github.com/jquery/jquery/issues/1729

Effects（效果）

更改：.show(), .hide(), and .toggle() 方法不考虑更多的样式表更改

jQuery用来显示和隐藏元素的代码已被更新，更新后的代码只专注于内联样式，而不是计算样式，对于样式表的display值，应该尽可能增加以兼容响应式设计技巧（其中活动的样式表规则可以在设备改变方向（愚人码头注：横屏，竖屏）/窗口调整大小等时动态地改变）。因此，未关联元素不再被视为 hidden (隐藏)，除非它们有内联样式display: none,同样的，从jQuery 3.0开始，.toggle()将不再区分关联和未关联元素。

此外，虽然.show()和类似的调用将继续强制迫使被样式表规则隐藏的元素可见，支持此功能会减慢所有显示/隐藏操作，并且不建议使用它。在这种情况下，确定设置哪个display（显示）值也已经被简化，当body级别规则按类型隐藏元素时，默认为“block”。

任何代码，希望隐藏的元素通过他们之前的计算 display（显示）样式来重新显示，或未关联的元素处理为隐藏，应予以审查。团队创建了一个与显示状态和显示/隐藏操作所有可能相关的表格,以便简化非空内联样式的设置。

功能：动画现在使用requestAnimationFrame

在支持requestAnimationFrame API的平台上，jQuery现在执行动画时使用这个API，对于老的浏览器（如IE9），它会使用之前的API。这将使得动画更流畅，更少的CPU处理时间 - 并在移动设备上更加省电。

jQuery几年前尝试使用了requestAnimationFrame，但与现在的代码存在严重的兼容性问题，所以我们不得不重新实现它。我们认为，我们已经在浏览器标签页在视图中不可见的时候，通过暂停动画解决了大部分的问题。仍然，任何依赖于动画的代码总是实时运行
是一个不切实际的假设。

弃用： jQuery.fx.interval

现在requestAnimationFrame正在应用于动画，所以jQuery.fx.interval属性在大多数浏览器上被忽略。但是它仍然存在于jQuery 3.0中，并在一些浏览器（如IE9）中仍然需要使用，但将在未来的主要版本中会被删除。

弃用：附加 easing（缓动）函数参数

通过.animate()调用的 easing（缓动）函数传递单个参数，完成的百分比。一些较旧的代码假设它传递派生自百分比的额外参数。这些额外参数可能不会出现在未来的主版本更新中。

一个老的 easing（缓动）方法的例子：

JavaScript代码:
$.easing.easeInOutSine =function(x, t, b, c, d){
return-c/2*(Math.cos(Math.PI*t/d)-1)+ b;
};

同样的 easing（缓动）方法重写：

JavaScript代码:
$.easing.easeInOutSine =function(x){
return-0.5*(Math.cos(Math.PI*x)-1);
};

https://github.com/jquery/api.jquery.com/issues/912

Event （事件）

更改：.load(), .unload(), 和 .error() 被移除

这些方法是事件操作的快捷方式，但有几个API限制。事件.load()方法与ajax .load()方法冲突。.error()方法不能与window.onerror一起使用，因为这种方式的DOM方法已经被定义。如果您需要通过这些名称绑定事件，请使用.on()方法，例如将$("img").load(fn)更改为$(img).on("load", fn)。

https://github.com/jquery/jquery/issues/2286

更改： .on(“ready”, fn) 被移除

jQuery不再支持名为"ready"的合成事件（可以与事件函数一起使用）。此事件容易出错，并在jQuery 1.8中弃用，因为它只会调用在文档准备好（document ready）之前附加的回调函数。用$(fn)替换任何用法，它可以可靠地工作。

https://github.com/jquery/jquery/issues/2264

更改： event.pageX和event.pageY 标准化删除

jQuery 3.0官方支持的所有浏览器在其事件中都提供了pageX和pageY属性，所以jQuery代码从其他事件属性计算出来的这些值已被删除。此更改不不会影响主流浏览器，但也有这些属性不存在的可能性。如果碰到这种情况，请告诉我们，提交一个bug。

https://github.com/jquery/jquery/issues/3092

更改：`jQuery.event.props` 和`jQuery.event.fixHooks` 被移除

jQuery的事件处理性能提高，主要感谢事件属性管理的整改。主要的改进是，jQuery现在只计算或复制第一次访问的属性，而不是计算和复制它们。强制布局的属性有可能是一个真正的大赢家，事件处理程序甚至可能不需要。我们知道的最常见的用法是为鼠标事件添加属性，这不再是必要的，因为在jQuery 3.0中这些事件已经被支持。如果你仍然需要他们，jQuery Migrate插件提供了对这些属性的支持。相关但未出现在文档中mouseHooks和keyHooks列表也被删除。在定义新的API之前，团队有兴趣了解其他用例，如果你有使用常见，会有告诉我们。

https://github.com/jquery/jquery/issues/3103

https://github.com/jquery/jquery/issues/1746

https://learn.jquery.com/events/event-extensions/

更改：带有错误选择器的委托事件会立即抛出错误

在jQuery 3.0之前，选择器在委托事件中直到第一次在元素上触发事件时才会被使用。这有时会导致难以调试的情况，错误脱离发生错误的时间和代码。现在，当事件被附加时，会检查选择器，并且如果它是无效的，则抛出错误。这被认为是一个突破性的变化，当附加事件从未触发时，唯一可能的原因是代码使用无效的选择器，并且这种情况下，以前从未抛出过错误。

https://github.com/jquery/jquery/issues/3071

弃用：.bind()和.delegate()方法

五年前在jQuery 1.7中，我们介绍了用.on() 方法附加事件处理程序。从3.0开始，旧的.bind(), .unbind(), .delegate() 和 .undelegate() 方法已被标记为弃用，但仍然存在。API文档说明了如何使用.on()和.off()方法重写调用。

Manipulation（DOM操作）

更改：.wrapAll(function) 只调用一次 function

在以前的版本中，当传递一个函数作为参数时，.wrapAll() 方法和 .wrap() 方法行为是完全一样的。这已经被更正;现在.wrapAll(function)只调用一次 function参数，使用函数调用得到的字符串结果包装整个集合。

https://github.com/jquery/jquery/issues/1843

Offset（偏移）

更改：.offset()方法的无效输入

当使用.offset()方法时，jQuery集合中的第一个项必须是带有 getBoundingClientRect()方法的DOM元素。（jQuery 3.0支持的所有浏览器都有这个API。）任何其他输入可能会导致jQuery抛出一个错误。还要注意，元素必须是可见的，并且在当前文档中（即，不脱离文档）。

https://github.com/jquery/jquery/issues/2115

https://github.com/jquery/jquery/issues/2114

Selector （选择器）

更改：`:hidden` 和 `:visible` 的行为

如果一个元素，它有一个从DOM getClientRects()方法返回的布局盒模型，那么这个元素被认为是可见的，即使该元素的高度和/或宽度为0。这意味着诸如<br />或空的<span>之类没有高度的元素被认为是可见的。

https://github.com/jquery/jquery/issues/2227

https://github.com/jquery/jquery/issues/2604

更改：`jQuery("#")` and `.find("#")` 是无效无法

如果一个选择器字符串只包含一个井号标记（hash-mark）,jQuery 3.0将会抛出语法错误。在以前的版本中，$("#")返回一个空集合,.find(“#”)会抛出一个错误。

https://github.com/jquery/jquery/pull/1682

功能：新增`jQuery.escapeSelector()`方法

新增的jQuery.escapeSelector( selector )方法接受选择器字符串并转义任何在CSS选择器中有特殊的含义字符。它本质上是CSS工作组的CSS.escape()方法的shim（垫片）,它能在所有jQuery支持的浏览器上运行。此方法对于一个CSS类名或一个ID包含的字符在CSS中具有特殊含义的情况下非常有用，如点或分号。。

例如，如果页面上有一个id为”abc.def”的元素，它不能用$( "#abc.def" )选择,因为选择器被解析为“一个 id 为’abc’的元素，具有’def’样式类名“。但是，它可以用$( "#" + $.escapeSelector( "abc.def" ) )来选择。

https://github.com/jquery/jquery/issues/1761

弃用：`jQuery.expr[":"]` 和 `jQuery.expr.filters`

These two names for defining custom selectors through jQuery’s Sizzle selection engine are the same as jQuery.expr.pseudos, so we are deprecating the redundant names.

这两个名称通过jQuery Sizzle选择器引擎用于定义自定义选择器，与jQuery.expr.pseudos相同，因此我们不赞成使用冗余名称。

Serialize

更改：jQuery.param（）不再将％20转换为加号

在通过jQuery.ajax() POST形式提交表单的时候，application/x-www-form-urlencoded编码规范规定出现的任何空格都应该转换为+字符。以前，jQuery通过在jQuery.param()中进行转换来实现这一点。现在，这个转换已移至jQuery.ajax() 。通过jQuery.param()编码的数据将空格转换为％20，这样直接它可以与原生的 JavaScript encodeURIComponent() 和 decodeURIComponent()方法兼容。

https://github.com/jquery/jquery/issues/2658

Traversing

更改：`.andSelf()` 被移除, 请使用 `.addBack()`

.andSelf()方法在jQuery 1.8中已被标记为弃用，现在在3.0中被删除，赞成使用.addBack()方法，以为.addBack()方法更好地解释它的作用，并且还接受可选的选择器参数以过滤添加回来的内容。

翻译自：https://jquery.com/upgrade-guide/3.0/

建议继续学习：

QQ技术交流群：445447336，欢迎加入！
扫一扫订阅我的微信号：IT技术博客大学习

<< 前一篇：用webgl打造一款简单第一人称射击游戏

后一篇：降低样式计算的范围和复杂度 >>

文章信息

作者：愚人码头来源： WEB前端开发
标签： jquery
发布时间：2016-11-06 22:36:27

建议继续学习

近3天十大热文

IT技术博客大学习