HP作ってみる!

(85) 【JQuery】クラスを追加、削除する。

1,773 views

この記事は最終更新から 2351日 が経過しています。

1. クラスを追加する。

IDが xxxxxxxx の要素に、クラス yyyyyyy を追加したい。

JQueryだとこんな風に書く。

jQuery('#xxxxxxxx').addClass("yyyyyyy");

JQueryを使わず、JavaScriptだとこんな風に書く。

var obj = document.getElementById('xxxxxxxx');
obj.classList.add('yyyyyyy');

2. クラスを削除する。

IDが xxxxxxxx の要素から、クラス yyyyyyy を削除したい。

JQueryだとこんな風に書く。

jQuery('#xxxxxxxx').removeClass("yyyyyyy");

JQueryを使わず、JavaScriptだとこんな風に書く。

var obj = document.getElementById('xxxxxxxx');
obj.classList.remove('yyyyyyy');

3. クラスの存在判定をする。

IDが xxxxxxxx の要素から、クラス yyyyyyy が含まれているかを確認したい。

JQueryだとこんな風に書く。

var exist = jQuery('#xxxxxxxx').hasClass("yyyyyyy");

JQueryを使わず、JavaScriptだとこんな風に書く。

var obj = document.getElementById('xxxxxxxx');
var exist = obj.classList.contains('yyyyyyy');

アクセス数(直近7日): ※試験運用中、BOT除外簡易実装済
  • 2026-07-27: 0回
  • 2026-07-26: 0回
  • 2026-07-25: 0回
  • 2026-07-24: 0回
  • 2026-07-23: 1回
  • 2026-07-22: 0回
  • 2026-07-21: 0回
  • モバイルバージョンを終了