jQueryは今から学ぶべき？新規開発と既存サイトの保守で考える

ひよこ

古いサイトのコードに$ってたくさんある。jQueryはもう使わないの？

ペンギン先生

$はjQueryで使うことがある記号だよ。ただし別のライブラリの場合もある。jQueryは終了しておらず、2026年には4.0も公開された。新しく作るのか、既存のコードを直すのかで学ぶ順番を変えるとよいね。

ひよこ

まず何を学べばいい？

ペンギン先生

HTMLとJavaScriptの基本を先に押さえよう。ボタンを探す、クリックを受け取る、文字を変える、といった処理は今のブラウザの標準機能でも書ける。jQueryの書き方を読むときにも、その理解が役立つよ。

ひよこ

jQueryの1行をそのまま標準機能に置き換えればいい？

ペンギン先生

同じとは限らないよ。jQueryの選択は複数要素を扱えるけれど、querySelectorは最初の1個かnullを返す。複数ならquerySelectorAllでループする。Ajaxとfetchもエラーの扱いなどが違うので、文字だけ置き換えないんだ。

ひよこ

新しい画面にもjQueryを入れる？

ペンギン先生

必要な機能やチームの知識、既存のプラグインで判断するよ。小さな動きなら標準JavaScriptで十分なことも多い。状態の多い画面ならReactやVueも候補になるけれど、「新しいから必ず必要」というわけではないよ。

ひよこ

WordPressなら勝手に外してもいい？

ペンギン先生

テーマやプラグインが依存しているかもしれないので、先に確認しよう。WordPressではwp_enqueue_scriptで依存を宣言して読み込む仕組みがある。別版を強制的に追加すると、二重読み込みや互換性の問題になることがあるんだ。

ひよこ

4.0に上げるだけで安全になる？

ペンギン先生

削除・変更されたAPIや対応ブラウザ、プラグインの対応を確認する必要があるよ。公式のアップグレードガイドとMigrateは移行を助ける道具。古い版からは段階的な確認が必要で、一気に差し替えて終わりとは言えない。

ひよこ

Reactと一緒に使ってはいけないの？

ペンギン先生

絶対に禁止というわけではないけれど、同じDOMを両方で書き換えると管理がぶつかりやすい。境界を分け、初期化や後始末まで考えよう。単にjQueryを削除すれば画面設計までよくなるわけではないんだ。

ひよこ

じゃあ「オワコンか」より、自分の仕事で考えるんだね。

ペンギン先生

その通り。新しく学ぶなら標準JavaScriptを土台に、保守するなら使われている版と依存関係を調べよう。読めるようになること、更新すること、置き換えることは別の作業として考えると迷いにくいよ。

最初の判断：作るのか、直すのか

jQuery 4.0は2026年1月17日に公開されています。「新機能が追加されない安定維持だけのライブラリ」「WordPressでしか使わない」と決めつけるのは適切ではありません。一方、利用率だけを根拠に自分の新規プロジェクトへ追加する必要もありません。

同じクリックでも、要素の数に注意

jQueryが読み込まれた画面では、次の処理は選択された複数のボタンへイベントを登録できます。

$('.btn').on('click', function () {
  this.textContent = '押したよ！';
});

標準JavaScriptで同じように複数を扱う例です。どちらも、対象のHTMLが用意された後に実行します。

document.querySelectorAll('.btn').forEach((button) => {
  button.addEventListener('click', () => {
    button.textContent = '押したよ！';
  });
});

querySelector('.btn') だと、最初の要素だけを返し、なければ null です。querySelectorAll は取得時点のリストなので、後から追加された要素への対応も別に考えます。「短いAPIが似ている」ことと「挙動が同じ」は違います。

既存サイトは依存関係から確認する

1. どの版がどこから読み込まれているかを調べる。
2. テーマ・プラグイン・自分の処理の依存を洗い出す。
3. バックアップと検証環境を用意する。
4. 公式ガイドに従い、必要な段階でMigrateの警告と実際の操作を確認する。
5. フォーム・メニュー・決済など重要な動作を確認してから反映する。

WordPressでは既存の登録済みスクリプトと依存管理を尊重します。Migrateは移行を助けますが、あらゆる古いプラグインの動作を保証しません。最新のURLへ読み込み先を差し替えるだけの手順にはしないようにしましょう。

最初のボタン操作から試すならJavaScript入門、状態から画面を作る考え方を学ぶならVue入門が次の入口です。

参考資料

2026年10月9日確認。

• jQuery — 4.0.0 release — 公開日・API更新
• jQuery — 4.0 Upgrade Guide — 互換性・Migrate・段階移行
• MDN — querySelectorAll — 複数要素と取得時点のリスト
• WordPress — wp_enqueue_script — 依存関係を指定する読み込み