「ホームページ制作にjQueryはまだ使っていいのか」。Web制作を学び始めた人からも、昔からサイトを運用している人からも、よく聞かれる質問です。職業訓練でjQueryを習った私自身、同じことを何度も考えました。

結論から言うと、新しく作るサイトでjQueryを選ぶ理由はほとんどなくなりましたが、「使われているサイト」は今も圧倒的に多く、読める・直せる力は当分必要です。この記事では、jQueryが果たした役割、2026年の現状(データと4.0のリリース)、使い続ける場合の注意点、これから学ぶ人が何をすべきかを整理します。

CONTENTS目次
  1. jQueryとは:ブラウザの差を吸収してくれた立役者
  2. 今のJavaScriptは、jQueryなしで同じことが書ける
  3. 2026年のjQuery:まだ使われている、そして4.0が出た
  4. それでもjQueryを使う場面
  5. jQueryを新規で使うデメリット
  6. ReactやVueとは併用しない
  7. それでも使う場合の3つのルール
  8. 結論:jQueryは「必須ではない」が「読めないと困る」
  9. これから学ぶなら何から?
  10. まとめ

jQueryとは:ブラウザの差を吸収してくれた立役者

jQueryは2006年に公開されたJavaScriptのライブラリです。目的は「ブラウザごとの違いを気にせず、短いコードでJavaScriptを書けるようにする」ことでした。

当時はInternet ExplorerとFirefoxとで要素の取得方法やイベントの書き方が違い、開発者は同じ処理を何通りも書く必要がありました。jQueryはその差を内部で吸収し、$('.btn').on('click', ...) のような短い書き方を提供したことで、一気に標準になりました。「JavaScriptを書くならjQuery」と言われた時代が10年以上続きます。

今のJavaScriptは、jQueryなしで同じことが書ける

状況を変えたのは、ブラウザ側の進化です。2015年のES2015(ES6)以降、JavaScriptの標準機能が充実し、jQueryの便利機能の多くが「素のJavaScript」で簡潔に書けるようになりました。

やりたいこと jQuery 素のJavaScript
要素の取得 $('.item') document.querySelectorAll('.item')
クリックイベント $('.btn').on('click', fn) document.querySelector('.btn').addEventListener('click', fn)
クラスの付け外し $(el).toggleClass('open') el.classList.toggle('open')
通信(Ajax) $.ajax({ url: '/api' }) fetch('/api').then(res => res.json())
フェードイン・スライド $(el).fadeIn() CSSの transition とクラスの切り替え

たとえば「ボタンを押したらメニューを開閉する」処理は、jQueryなしで次のように書けます。

// jQuery
$('.menu-btn').on('click', function () {
  $('.menu').toggleClass('is-open');
});

// 素のJavaScript
document.querySelector('.menu-btn').addEventListener('click', () => {
  document.querySelector('.menu').classList.toggle('is-open');
});

つまり、「昔はjQueryでしか書けなかったこと」が、今はブラウザの標準機能だけでできるようになったのです。

2026年のjQuery:まだ使われている、そして4.0が出た

使われている割合は今も大きい

「jQueryはもう終わった」と言われて久しいですが、データを見ると印象が変わります。Web技術の統計サイトW3Techsによると、2026年10月時点で全Webサイトの約65%がjQueryを使っており、JavaScriptライブラリを使っているサイトの中では約86%を占めています(W3Techs: Usage statistics of jQuery)。新規サイトで選ばれなくなっても、既に動いているサイトの数が桁違いに多いためです。

WordPressには今も同梱されている

WordPressは本体にjQuery(執筆時点では3.7.1)を同梱しており、多くのテーマやプラグインが今も依存しています。WordPressでサイトを作る限り、自分では書かなくてもjQueryは読み込まれていることが多い、というのが実情です。

約10年ぶりのメジャーバージョン、jQuery 4.0

2026年1月17日に、約10年ぶりのメジャーバージョンとなるjQuery 4.0.0がリリースされました。Internet Explorer 10以前や旧Edgeなど古いブラウザのサポートを打ち切り、ファイルサイズを削り、内部を現代的に書き直したバージョンです。IE11のサポートは残っていますが、次の5.0で終了する予定とされています。

これは「jQueryはまだ保守されている」というメッセージである一方、「古い環境のためのライブラリから、現代のブラウザ前提のライブラリに変わった」ということでもあります。古いプラグインがそのまま動くとは限らないので、既存サイトで安易にバージョンを上げるのは危険です。

それでもjQueryを使う場面

1. 既存サイトの保守

企業のコーポレートサイトや官公庁サイトには、10年以上前に作られたものが多く、jQueryが深く組み込まれています。改修のたびにすべてを書き換えるのは現実的ではなく、既存コードとの互換性を保ちながら使い続けるのは理にかなっています。Web制作の仕事を始めると、こうした保守案件は想像以上に多いです。

2. WordPressのテーマやプラグインとの互換性

前述のとおり、WordPressではテーマやプラグインがjQueryに依存していることがよくあります。この場合、自分のコードだけjQueryを排除しても読み込みは減らないので、「すでに読み込まれているなら使う」という判断もあり得ます。

3. 小規模サイトで、プラグインを使ってすぐ動きを付けたい

数ページの小さなサイトで、スライドショーやアコーディオンをすぐ付けたいとき、「jQuery+実績のあるプラグイン」は今も手早い選択肢です。ただし、同じことができるjQuery不要のライブラリ(スライダーならSwiperなど)も増えているので、まずそちらを探すことをおすすめします。

jQueryを新規で使うデメリット

1. ファイルサイズ

jQuery本体は、圧縮版でも約90KB(通信時のgzip圧縮後で約30KB)あります。小さなサイトでメニューの開閉にしか使わないなら、そのためだけに読み込むには大きいファイルです。表示速度の指標であるCore Web Vitals(特にLCPと、2024年にFIDに代わって正式指標となったINP)にも影響し得ます。

2. 保守性

現在のJavaScriptはモジュールやクラス構文で処理を分けて書くのが主流です。jQueryのコードは1つのファイルにイベント処理を書き連ねる形になりがちで、規模が大きくなると「どこで何をしているか」が追いにくくなります。

3. 古いプラグインへの依存

jQuery本体は保守されていますが、その上で動く無数のプラグインの多くは更新が止まっています。ブラウザの仕様変更やjQuery本体のバージョンアップで動かなくなる例は実際に増えています。外部ライブラリに頼るほど、その更新リスクを引き受けることになります。

ReactやVueとは併用しない

今のWebアプリ開発では、React、Vue.js、Next.js、Svelteといったフレームワークが主流です。これらは「画面の状態を管理し、状態に応じてDOMを自動で描き直す」仕組みで動いています。

一方、jQueryは「DOMを直接書き換える」道具です。両者を同じ画面で混ぜると、フレームワークが描き直したタイミングでjQueryの変更が消えたり、逆にフレームワークの管理外の変更で表示が壊れたりします。基本的に併用は避け、フレームワークを使うならその流儀で書きます。

それでも使う場合の3つのルール

  1. 読み込む場所を限定する:すべてのページで読み込まず、必要なページだけにする
  2. バージョンを固定する:1系・2系・3系・4系で動作が違う。使うバージョンを明記し、むやみに上げない。特に3系から4系への移行は、プラグインの対応状況を確認してから
  3. 将来の置き換えを前提にする:「一時的な利用」と割り切り、HTMLの構造はjQueryがなくても成り立つように整理しておく

結論:jQueryは「必須ではない」が「読めないと困る」

観点 評価
学習コスト 低い。初心者にも分かりやすい
新規サイトでの必要性 低い。素のJavaScriptで同じことが書ける
既存サイトでの遭遇率 非常に高い。全サイトの約65%が使用
モダンなフレームワークとの相性 悪い。併用しない
保守の継続性 本体は継続(2026年に4.0)。プラグインは要注意

まとめると、新規サイトでは積極的に使う理由はないが、保守案件やWordPressでは今も現役。「書けなくてもいいが、読めて直せる」状態にしておくのが現実的です。

これから学ぶなら何から?

これからWeb制作を始める人には、次の順番をおすすめします。

  1. 素のJavaScript(Vanilla JS):要素の取得、イベント、クラスの切り替え、fetch。ここが土台で、jQueryもReactもこの上に乗っている
  2. jQueryは「読める」程度に:上の対応表が頭に入っていれば、既存コードを読んで素のJavaScriptに置き換えられる。保守案件で困らない
  3. フレームワーク(React / Vue / Svelte など):動的なUIやWebアプリを作る段階で。状態管理とコンポーネントの考え方を学ぶ
  4. ビルド環境(Vite / Next.js など):現場の開発フローに合わせる段階で

AIにコードを書いてもらえる時代になりましたが、AIはjQueryのコードも素のJavaScriptも混ぜて出してきます。どちらで書かれているか見分け、どちらにすべきか判断するのは人間の仕事です。その判断力は、1の土台があって初めて身につきます。

まとめ

  • jQueryはブラウザ間の差を吸収した功労者。その役割は、ブラウザの進化でほぼ終わった
  • 2026年10月時点でも全サイトの約65%が使用。WordPressにも同梱。既存サイトでの遭遇率は非常に高い
  • 2026年1月に約10年ぶりの4.0がリリース。保守は続くが、古いブラウザ向けではなくなった
  • 新規サイトでは使わない。保守案件・WordPressでは「読めて直せる」力が必要
  • 学ぶ順番は、素のJavaScript → jQueryは読める程度 → フレームワーク

ツールは流行ではなく、目的で選ぶものです。「何を使うか」より「なぜ使うか」を自分の言葉で説明できることが、2026年のWeb制作では求められています。

前回はWebデザインのコンテンツ幅はどう決める?、次回はPCはMac?Windows?実際に使って感じたメリット・デメリットです。連載の全体像は第1回「HTML・CSSはどこで習う?」の末尾にある一覧からたどれます。

参考