在前端开发的过程中,虽然现在jQuery的比重降低了,但是它不至于被遗忘,在处理一些单页面和简单页面处理的时候还是要用到,所以我们不能丢弃它。今天来看下 jQuery 4.0 新版本带了什么大改变。
其实 jQuery 4.0 已经开发很长时间了,但现在已经准备好发布测试版了!有很多内容需要介绍,团队很高兴看到它的发布。我们修复了错误、改进了性能并进行了一些重大更改。毕竟我们取消了对 IE<11 的支持!尽管如此,我们预计干扰将是最小的。
许多重大更改是团队多年来一直想要做出的更改,但在补丁或次要版本中未能实现。我们修剪了遗留代码,删除了一些以前已弃用的 API,删除了一些从未记录在案的公共函数的仅限内部参数,并放弃了对一些过于复杂的"神奇"行为的支持。
我们将在最终版本之前发布全面的升级指南,概述已删除的代码以及如何迁移。jQuery Migrate 插件也将随时提供帮助。
与往常一样,该版本可在我们的 CDN和 npm 包管理器上获取。第三方 CDN 将不会托管此测试版,但稍后将托管 4.0.0 最终版本。以下是 jQuery 4.0.0 beta 的一些亮点。
再见 IE<11
jQuery 4.0 不再支持 IE 10 及更早版本。有人可能会问为什么我们没有取消对 IE 11 的支持。我们计划分阶段取消支持,下一步将在 jQuery 5.0 中发布。现在,我们将首先删除专门支持早于 11 的 IE 版本的代码,使我们在一个 PR 中减少 -867 个 gzip 字节的大小!
我们还放弃了对其他非常旧的浏览器的支持,包括 Edge Legacy、iOS <11、Firefox <65 和 Android 浏览器。您无需进行任何更改。如果您需要支持任何这些浏览器,只需坚持使用 jQuery 3.x。
已删除已弃用的 API
这些函数在多个版本中已被弃用。现在我们已经发布了主要版本,是时候删除它们了。这些函数要么始终是内部函数,要么现在在所有受支持的浏览器中具有本机等效函数。删除的功能是:
-
jQuery.cssNumber
-
jQuery.cssProps
-
jQuery.isArray
-
jQuery.parseJSON
-
jQuery.nodeName
-
jQuery.isFunction
-
jQuery.isWindow
-
jQuery.camelCase
-
jQuery.type
-
jQuery.now
-
jQuery.isNumeric
-
jQuery.trim
-
jQuery.fx.interval
push
、sort
、 并splice
删除
jQuery 原型长期以来一直拥有 Array 方法,这些方法的行为与任何其他 jQuery 方法不同,并且始终仅供内部使用。这些方法是push
、sort
、 和splice
。我们将这些方法的使用改为数组函数,而不是 jQuery 原型。例如,$elems.push( elem )
成为[].push.call( $elems, elem )
.我们在这里提到它是为了防止有任何插件可能依赖于这些方法。
focusin
和focosout
事件顺序
长期以来,浏览器对于焦点和模糊事件的顺序并没有达成一致,其中包括focusin
、focusout
、focus
和blur
。最后,jQuery 4.0 支持的所有浏览器的最新版本都集中在一个公共事件顺序上。不幸的是,它与 jQuery 多年前选择的一致顺序不同,这使得这是一个突破性的改变。至少现在每个人都在同一页面上!
jQuery 在以前的版本中对所有四个事件的顺序是:
1. focusout
2. blur
3. focusin
4. focus
从 jQuery 4.0 开始,我们不再覆盖本机行为。这意味着除 IE 之外的所有浏览器都将遵循当前的 W3C 规范,即:
1. blur
2. focusout
3. focus
4. focusin
对于那些好奇的人来说,W3C 规范之前定义了不同的顺序:
1. focusout
2. focusin
3. blur
4. focus
但是,很少有人认为直观性和规范在 2023 年发生了变化,以匹配浏览器已经实现的内容。讽刺的是,唯一遵循旧规范的浏览器是 Internet Explorer。
FormData
支持
jQuery.ajax
添加了对二进制数据的支持,包括FormData
.以前,二进制数据不是已知的数据类型,而是转换为字符串。可以通过禁用数据转换和手动处理数据来禁用该行为,但我们决定自动执行此操作。这在技术上是一个重大变化,但应该更接近预期的行为。
删除自动 JSONP 升级
以前,jQuery.ajax
使用dataType: "json"
提供的回调将转换为 JSONP 请求。如今,与跨域后端交互的首选方式是使用CORS,它适用于 jQuery 4.0 支持的所有浏览器。如果开发人员不知道可以使用 JSONP 从远程域执行代码,这应该有助于避免意外行为。
jQuery 源迁移到 ES 模块
这是一个特殊的日子,分支上的 jQuery 源从AMDmain
迁移到ES 模块。 jQuery 源代码始终在 npm 和 GitHub 上与 jQuery 版本一起发布,但如果没有RequireJS(jQuery 的首选构建工具),则无法直接作为模块导入。此后,我们改用Rollup来打包 jQuery,并且我们确实在 ES 模块上单独运行所有测试。
可信类型和 CSP
jQuery 4.0 添加了对Trusted Types的支持,确保包含在TrustedHTML中的 HTML可以用作 jQuery 操作方法的输入,而不会违反require-trusted-types-for
内容安全策略指令。
除此之外,虽然一些 AJAX 请求已经使用<script>
标签来维护 等属性crossdomain
,但我们已将大多数异步脚本请求切换为使用 <script> 标签,以避免因使用内联脚本而导致的任何 CSP 错误。仍有少数情况需要使用 XHR 进行异步脚本请求,例如"headers"
传递选项时(使用scriptAttrs
替代!),但我们现在<script>
尽可能使用标签。
更新的slim build
在 jQuery 4.0.0 中,由于删除了 Deferreds 和 Callbacks(现在压缩后低于 20k 字节!),苗条的构建变得更加小。 Deferreds 长期以来一直支持Promises A+ 标准,因此在大多数情况下可以使用原生 Promises,并且它们在除 IE11 之外的所有 jQuery 支持的浏览器中都可用。 Deferred 确实有一些原生 Promise 不支持的额外功能,但大多数用法可以迁移到 Promise 方法。如果您需要支持 IE11,最好使用主构建或为原生 Promises 添加一个 polyfill。
下载
您可以从 jQuery CDN 获取文件,或直接链接到它们:
https://code.jquery.com/jquery-4.0.0-beta.js
https://code.jquery.com/jquery-4.0.0-beta.min.js
您还可以从 npm 获取此版本:
npm install jquery@4.0.0-beta
Slim build
有时您不需要 ajax,或者您更喜欢使用专注于 ajax 请求的众多独立库之一。通常,结合使用 CSS 和类操作来实现 Web 动画会更简单。最后,所有 jQuery 支持的浏览器(IE11 除外)现在都全面支持本机 Promise,因此大多数情况下不再需要 Deferred 和 Callback。除了包含所有内容的 jQuery 常规版本之外,我们还发布了不包含这些模块的"精简"版本。如今,jQuery 的大小很少成为加载性能问题,但精简版本比常规版本小约 8k gzipped 字节。这些文件也可以在 npm 包和 CDN 中找到:
https://code.jquery.com/jquery-4.0.0-beta.slim.js
https://code.jquery.com/jquery-4.0.0-beta.slim.min.js
这些更新已作为 npm 和 Bower 上的当前版本提供。有关获取 jQuery 的所有方法的信息,请访问https://jquery.com/download/。公共 CDN 今天收到了副本,请给他们几天时间来发布文件。如果您急于快速开始,请使用我们 CDN 上的文件,直到它们有机会更新。