接手一个老站点,页面里到处是 $ 和 $(document).ready,新来的同事问 jquery是干什么的。简单说,它是一套 JavaScript 工具库,把选元素、改样式、绑事件、发请求这些重复活包装成了短命令。
它把原生写法缩短了一大截
原生要写 document.getElementById('box').style.display = 'none',jQuery 一句 $('#box').hide() 就完事。绑定点击事件,从 addEventListener 变成 .on('click', fn),加类名从 classList.add 变成 .addClass。代码短,读起来也顺。
$(function () { $('.btn').on('click', function () { $('#box').addClass('show').fadeIn(); }); });上面这段就是典型用法:等文档加载完,给按钮绑事件,点一下让盒子显示并淡入。方法可以连着写,因为大多数函数返回的还是同一个对象,这就是链式调用。
当年火是因为兼容老浏览器
IE8 年代,querySelector、classList、fetch 这些要么没有,要么行为不一致。jQuery 在内部做了判断,开发者写一套代码就能跑遍各家浏览器,AJAX 也用 $.ajax 统一了。那几年几乎每个网站都引一个 jquery.min.js,插件生态也跟着起来了。
现在还要不要学
新项目用 Vue、React,或者原生 querySelector 加 fetch,基本用不上它。但大量老系统、CMS 模板、后台插件仍依赖 jQuery,维护的时候躲不开。接活前先看页面头部有没有引入,有就按它的写法来,别硬改成框架。
还有两个小坑。$ 符号可能和别的库冲突,可以用 jQuery.noConflict() 让出;1.x 版本支持老 IE,3.x 只面向现代浏览器,混用插件容易报错。jquery是干什么的,说到底就是一套省事的旧工具,新站不必上,老站离不开。