jQuery：仍有价值还是已成古董

如果你刚涉足前端开发，可能会被jQuery搞晕。它到底是做什么的？为什么要用它？这究竟是一门值得学习的技术吗？让我们从一些历史开始，一探究竟。

在2008年用jQuery：如虎添翼

2008年，我的第一份编程工作开始了。当时，我主要负责构建网站，最大的问题是：它能在IE6浏览器上正常运行吗？让网站在IE6上看起来一致，花费的时间往往是前端开发工作的50%，而这也是最无趣的部分。

jQuery在当时可以帮助解决与浏览器相关的诸多问题。

浏览器兼容性问题

当时浏览器之间存在很多差异。如果你在现代浏览器(如Firefox或Chrome)中测试你的代码，并不能保证它能在IE中正常工作。CSS方面存在许多差异，JS方面则要少一些。

当时的最佳实践是先让网站在现代浏览器中正常工作，以便未来可以做出相应的补丁，然后再添加一些必要的技巧以让它在较旧的浏览器中正常工作。

jQuery解决了部分问题——它提供的方法在所有支持的浏览器中都能正常工作。应用程序的所有替代方案都被移除。

有许多基于jQuery的用户界面(UI)组件库，其中最著名的是jQuery UI，使用这些库可以使营销界面元素在所有的浏览器上看起来都是正确的，并且可以工作。

选择器

CSS有一个非常合理的模型用于从文档中选取元素：选择器。

当时，JavaScript只在浏览器上使用：因此，JS和CSS由同一群人使用的，他们也想要在JS端使用CSS选择器。当时浏览器没有浏览器没有这样的原生功能。

这是jQuery提供的另一项功能。有了它，你可以使用如下简单的语句找到DOM元素：

var element = $(‘.some-class’);

晦涩难懂的浏览器API

初版JavaScript是在10天内开发出来的，因此有许多粗略的地方。

它的临时性在这些年来一直得到延续。XMLHttpRequest是将JavaScript变成可用于开发浏览器端应用程序的语言的关键功能，它允许从JS向服务器发出额外的请求。使用它的方式不太好理解：

const request = new XMLHttpRequest();

request.addEventListener("load", function () {

console.log(this.responseText);

}

);

request.open("GET", "http://www.example.org/example.txt");

request.send();

使用jQuery，可以以更易读的方式实现同样的目标：

$.ajax({

method: "GET",

url: "http://www.example.org/example.txt",

})

.done(function( msg ) {

// or however the result was read in jQuery 1.2

console.log(msg);

});

现代浏览器提供的解决方案

如果你最近才开始前端之旅，你不太可能在实践中看到这些问题——除非你维护的是IE 6接口，它被固化在某些企业环境中。

多亏了Chrome/Firefox这些现代浏览器，我们很少听说兼容性问题。如果你日常使用的业务应用可以正常运行，你可以认为所有的浏览器都能正常工作。并等待错误报告，以防它们的工作方式不尽相同。

API问题也得到了解决——我们有document.querySelectorAll和fetch，它们提供了一个不错的API，可以使用原生函数执行常见操作。

jQuery仍在流行

尽管jQuery不再是焦点，但它仍然是一个非常流行的包。

如果将它与React、Vue和Angular进行比较，只有React有更多的下载量。你可以期待在很多正在运行的项目中看到它。特别是考虑到大量的jQuery用法可能不会通过NPM进行，很多会使用已被弃用的包管理器Bower或CDN链接。

为什么2022年还在用jQuery

我看到的主要原因是，你拥有一支习惯于使用它的团队——可能不是前端开发人员，也可能是学会了使用jQuery工作的内容作者、设计师或营销专家，他们看不到有什么必要改变它的理由。你也可能出于一致性的考虑，仍然选择保持这种情况。例如，如果你的代码库中有200个$.ajax调用，我会在添加一些fetch调用之前三思而行。这将是一次大规模的重构，我不确定在什么情况下投入如此大的精力才会有意义。

我该学习jQuery吗

学习jQuery没有坏处，但在新建项目时，最好默认使用vanilla JS。如果你加入一个已经严重依赖jQuery的项目，可以通过阅读文档(我曾编写过一份指南)和学习代码库中的代码示例来熟悉它。