jQuery 3.4.0 发布

发布于 作者

jQuery 有了一个新的版本！自从上次发布以来已经有一段时间了，但我们预计这将是 3.x 分支的最后一次小版本发布，然后我们将开始对 jQuery 4.0 进行全面改造。但在进入 4.0 之前，我们很高兴地分享 jQuery 3.4.0 中包含的错误修复和改进。以下是一些亮点

.width 和 .height 的性能改进

在获取和设置尺寸时，在某些情况下，这可能会导致布局抖动，基本上意味着浏览器计算布局的次数超过了必要的次数。我们已在除 IE 之外的所有浏览器中修复了此问题，在 IE 中无法避免。

nonce 和 nomodule 支持

为了支持通过 .html 和 .append 等方法添加脚本元素，jQuery 将它们分开，并将新的脚本标签附加到加载和执行远程内容。在此过程中，诸如 nonce 和 nomodule 之类的属性被忽略了，但 jQuery 3.4.0 现在会保留它们。

单选元素：事件处理程序中的预期状态

我们已经修复了复选框中相同的问题，但不小心遗漏了单选输入。在下面的示例中，第一次单击该元素时记录了 true。我们已修复它，以便在执行事件处理程序之前更新 checked 属性。

示例

var $radios = jQuery(".example");
var $firstRadio = $radios.first();
var firstCheckedState = $firstRadio.prop("checked");
$radio.on("click", function() {
  // true in <3.4.0
  console.log($firstRadio.prop("checked") === firstCheckedState);
});
$radios.eq(1).click();

次要漏洞修复：Object.prototype 污染

jQuery 3.4.0 包含对使用 jQuery.extend(true, {}, ...) 时某些意外行为的修复。如果未经过清理的源对象包含一个可枚举的 __proto__ 属性，它可能会扩展本机 Object.prototype。此修复包含在 jQuery 3.4.0 中，但 补丁差异 存在于以前的 jQuery 版本中。

示例

jQuery.extend(true, {},
  JSON.parse('{"__proto__": {"test": true}}')
);
console.log( "test" in {} ); // true

请注意，虽然 jQuery 会尽最大努力保护用户免受安全漏洞的影响，但 jQuery 是一个 DOM 操作库，通常会按照您指示的方式执行。在这种情况下，该行为可能是不期望的，因此 jQuery.extend 将不再写入任何名为 __proto__ 的属性。但是，这种保护措施不能替代良好的安全实践，例如用户输入清理。

弃用位置选择器和 Sizzle 的日落

jQuery 的基本 API 是选择一些内容，然后对所选内容执行一些操作。Sizzle 是 jQuery 中的选择器引擎，它处理第一部分。它是一个快速高效的引擎，为本机选择器 API（如 querySelectorAll 以及其他本机 JavaScript 和 CSS 选择器）铺平了道路。现在，许多这些选择器已经进入了现代浏览器，我们几乎可以告别 Sizzle 了。但是，为了在 jQuery 4.0 中删除 Sizzle，我们还需要删除我们所说的位置选择器，这些是非标准选择器。

具体来说，jQuery 3.4.0 正在弃用 :first、:last、:eq、:even、:odd、:lt、:gt 和 :nth。当删除 Sizzle 时，我们将用一个围绕 querySelectorAll 的小包装器来替换它，并且在没有更大的选择器引擎的情况下几乎不可能重新实现这些选择器。

我们认为这种权衡是值得的。请记住，我们仍然支持位置方法，例如 .first、.last 和 .eq。您可以使用位置方法来代替位置选择器执行任何操作。无论如何，它们性能更好。

升级

从 jQuery 3.0+ 升级时，不应存在兼容性问题。如果您尚未升级到 jQuery 3+，请查看 3.0 升级指南。 jQuery Migrate 3.0 插件 将帮助您识别代码中的兼容性问题。

请尝试使用此新版本，并 告知我们您遇到的任何问题。

下载

您可以从 jQuery CDN 获取文件，或直接链接到它们

https://code.jqueryjs.cn/jquery-3.4.0.js

https://code.jqueryjs.cn/jquery-3.4.0.min.js

您也可以从 npm 获取此版本

npm install jquery@3.4.0

精简版

有时您不需要 ajax，或者您更喜欢使用许多专注于 ajax 请求的独立库。而且，通常使用 CSS 和类操作进行 Web 动画更简单。除了包含 ajax 和效果模块的常规 jQuery 版本之外，我们还发布了一个“精简”版本，该版本排除了这些模块。如今，jQuery 的大小很少成为加载性能问题，但精简版本比常规版本小约 6k 压缩字节。这些文件也可用在 npm 包和 CDN 上

https://code.jqueryjs.cn/jquery-3.4.0.slim.js

https://code.jqueryjs.cn/jquery-3.4.0.slim.min.js

这些更新已经作为 npm 和 Bower 上的当前版本提供。有关获取 jQuery 的所有方式的信息，请访问 https://jqueryjs.cn/download/。公共 CDN 今天会收到其副本，请给它们几天时间来发布文件。如果您急于开始，请使用我们 CDN 上的文件，直到它们有机会更新为止。

感谢

感谢所有参与此版本发布的人员，他们提交了补丁、报告了错误或进行了测试，包括 abnud1、Jason Bedard、buddh4、Kris Borchers、Andrei Fangli、Oleg Gaidarenko、Richard Gibson、Michal Golebiowski-Owczarek、Marja Hölttä、Dave Methvin、Ed S、Luis Emilio Velasco Sanchez、Saptak Sengupta、tmybr11、Bert Zhang 以及整个 jQuery 团队。

变更日志

GitHub changelog： 3.4.0 中修复的问题 | 所有更改

Ajax

  • 允许在脚本传输中使用自定义属性（#3028，1f4375a3）
  • 修复 IE11 中的 getResponseHeader(key)（#3403，e0d94115）

核心

  • 使用 isAttached 检查元素的附加情况（662083ed）
  • jQuery.extend / jQuery.fn.extend 的微小效率修复（#4245，4ffb1df8）
  • 在 DOM 操作中保留 CSP nonce 属性（#4323，00504037）
  • 在 DOM 操作中保留 CSP nonce（#3541，c7c2855e）
  • 支持通过 jQuery.globalEval 传递 nonce（#4278，5bdc85b8）
  • 识别 Shadow DOM 中的附加检查（#3504，9b77def5）
  • 防止 Object.prototype 污染，用于 $.extend( true, … )（753d591a）

CSS

  • 确保 CSS 变量的驼峰式和连字符式名称不合并（f8c1e902）
  • 避免填充 jQuery.cssProps（#3986，2b5f5d5e）
  • 正确检测具有非默认缩放的卷曲框支持（#4029，821bf343）
  • 不要为动画的非元素属性附加“px”（#4063，75b77b48）
  • 跳过为动画的非元素属性附加“px”的逻辑（f5e36bd8）
  • 避免在 width/height 获取器中强制重新布局，除非必要（#4322，a0abd15b）
  • 除非必要，否则不要读取 styles.position 在 width/height cssHook 中（#4185，354f6036）
  • 不要为可能无单位的 CSS 网格属性附加“px”（#4007，f997241f）

Dimensions

  • 修复计算 SVG 的外宽（#3964，e743cbd2）
  • 避免在设置 width/height 时获取 boxSizing – 这避免了在某些情况下强制重新布局（#3991，73d7e625）
  • 回退到 border-box 的 offsetWidth/Height，用于 IE（#4102，315199c1）

事件

  • 防止 leverageNative 触发 focusin 两次（fe5f04de）
  • 向 Event 对象添加“code”属性（#3978，899c56f6）
  • 利用本机事件进行 focus/blur/click；传播其他数据（#1741，#3423，#3751，#4139，669f720e）
  • 在 DOM 操作中尊重脚本 nomodule 属性（#4281，e4de8b46）
  • 恢复 _evalUrl jQuery.ajax 调用到 dataType：script（13de7c9e）
  • 仅评估 HTTP 成功的脚本 src（#4126，c2026b11）

操作

  • 正确检测具有单字符名称的 HTML 元素（#4124，979809c5）

其他

  • 添加 lockbot 配置（2348f399）
  • 更新许可证序言/结尾以安抚 Github 检查器（29e76e25）

README

  • 向 README.md 添加 gitter 徽章（7869f83d）
  • 添加 FOSSA 许可证扫描状态徽章（45f08588）

选择器

序列化

  • jQuery.param：当给定 null/undefined 时返回空字符串（#2633，0645099e）

Traversing

内部

  • 更新 uglify 及其选项（09684ba3）
  • 删除不必要的 ESLint 异常（dc05f3c1）
  • 在 jsdom 中运行基本测试套件（0ec25abb）
  • 删除手动 QUnit 固定程序重置（84b6a0be）
  • 使 Promises/A+ 测试使用点报告器而不是默认报告器（ca9356ec）
  • 将 QUnit 从 1.23.1 更新到 2.9.2（6ced2639）
  • 在 Node.js 10 而不是 8 上运行 Karma 浏览器测试（16ad9889）
  • 更新 jsdom；将使用 Symbol polyfill 的测试迁移到 iframe 测试（9cb124ed）
  • 删除过时的全局变量的 ESLint 配置（c10945d0）
  • 更新大多数依赖项（8751e9ef）
  • 更新测试代码以与 QUnit 2.x 兼容（c3498187）
  • 建议在 JS Bin 或 CodePen 上创建测试用例，放弃 JSFiddle（da44ff39）

21 条评论在 “jQuery 3.4.0 发布”

  2. Mikhail 发表于 说：

    工作做得很好。期待未来使用浏览器原生选择器获得更多速度提升。

  4. cheong00 发表于 说：

    请不要移除选择器，特别是 :first 和其对应项 :not(:first)，因为出于未知原因，这些选择器从未在 Chrome/Firefox 中实现，我们使用这些选择器“规避”了许多显示行为。

    更糟糕的是，Edge 将更改为使用 Chromium 作为渲染引擎，这将使对这些选择器的支持消失。

    我想象移除它们会破坏许多现有网站。

  5. cheong00 发表于 说：

    哈哈，我刚刚查阅了 MDN 关于我之前评论中提到的 Edge、Chrome 和 Firefox 的支持情况。事实上，MDN 讨论的是 @page 的特定用法，因此与此无关。

  8. Garry Lowther 发表于 说：

    继续努力。不要让诋毁者打击你。jQuery 仍然是 Web 浏览器开发的基础。

  10. Timmy 发表于 说：

    @MM 像这些扩展选择器仍然是可能的，但位置选择器要复杂得多。

  11. nata 发表于 说：

    你好，我想知道这是否是问题所在。我在自动化中遇到了以下错误。我升级到最新版本，但在移动设备模拟中，浏览器的大小会发生变化。我使用 Codeception，每次运行一个步骤时，浏览器的大小都会发生变化。

  12. Anh Tran 发表于 说：

    非常感谢你们不断改进这个库。如果没有 jQuery，我今天无法取得我现在的开发职业生涯！

  14. Danny 发表于 说：

    干得漂亮。我能够在几分钟内将一个大型电子商务项目从 jQuery 2.2.4 升级到 jQuery 3.4.0，没有任何问题。继续努力。

  15. Evildead 发表于 说：

    如何选择表格列的所有单元格，而不使用 :nth-child 选择器？

    这可以使用 table.find(‘td:nth-child(2)’) 有效地完成，它选择每行中的第二个子元素。使用 .eq() 将仅选择第一行的第二个子元素。

  16. Anisa Petrai 发表于 说：

    你好，我想知道这是否是问题所在。我在自动化中遇到了一个错误。我升级到最新版本，但在移动设备模拟中，浏览器的大小会发生变化。我使用 Codeception，每次运行一个步骤时，浏览器的大小都会发生变化。

  17. goosfand zende 发表于 说：

    你好，
    请不要移除选择器，特别是 :first 和其对应项 :not(:first)，因为出于未知原因，这些选择器从未在 Chrome/Firefox 中实现，我们使用这些选择器“规避”了许多显示行为。

  19. H-rmi 发表于 说：

    所有错误消息在表格布局中都会移到左上角，如果使用 jquery-validation-engine。我想 jQuery 3.4.0 的 position() 已经降级了。