ホームページ  >  記事  >  ウェブフロントエンド  >  jQuery の CSS クラスの追加/削除クラスの実装 Code_jquery

jQuery の CSS クラスの追加/削除クラスの実装 Code_jquery

WBOY
WBOYオリジナル
2016-05-16 18:34:49957ブラウズ

1 つの方法は、ページ要素の CSS クラス (Class) を変更することです。従来の Javascript では、通常、HTML Dom の classname 属性を処理することによってこれを実行します。ただし、jQuery には、この機能を実現するための 3 つのメソッドが用意されています。従来の方法ですが、多くのコードを節約できます。同じ文 - 「jQuery は JavaScript コードを簡潔にします!」

1. addClass() - CSS クラスを追加します

Copy code コードは次のとおりです:

$("#target").addClass("newClass");
//#target は、 need スタイルが追加される要素の ID
//newClass は CSS クラスの名前を参照します

2.removeClass() - CSS クラスを削除します
コードをコピー コードは次のとおりです:

$("#target")。 RemoveClass("oldClass");
//#target は、CSS クラスを削除する必要がある要素の ID を参照します
//oldClass は、CSS クラスの名前を参照します

3. toggleClass() - CSS クラスの追加または削除: CSS クラスがすでに存在する場合は削除され、逆に CSS クラスが存在しない場合は追加されます。
コードをコピー コードは次のとおりです:

$("#target").toggleClass ("newClass ")
//ID が「target」の要素に CSS スタイルが定義されている場合は削除されます。
//逆に、CSS クラス「newClass」がその ID に割り当てられます。 。

4.hasClass("className") - CSS が既に存在するかどうかを判断します

実際のアプリケーションでは、最初にこれらの CSS クラスを定義してから変更することがよくあります。 Javascript イベントトリガー (リンクのクリックなど) によるページ要素のスタイル。さらに、jQuery は、要素に CSS クラスが割り当てられているかどうかを判断するメソッド hasClass("className") も提供します。
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。