jQuery は CSS クラスを追加/変更/削除し、CSS_jquery がすでに存在するかどうかを判断します

WBOY
リリース: 2016-05-16 16:38:59
オリジナル
1095 人が閲覧しました

ページ要素のスタイルの変更は Javascript を使用しても実現できますが、もっと簡単な方法はありますか? 答えは「はい」です。jQuery を使用すると、Js コードが大幅にスリム化されたようです。これは文のとおりです。 : 「jQuery で JavaScript コードが簡潔になります! それでは、本題に戻り、jquery がどのように CSS クラスを追加および削除するかを見てみましょう:

1.removeClass() - CSS クラスを削除します

$("#target").removeClass("oldClass"); 
//#target 指的是需要移除CSS类的元素的ID 
//oldClass 指的是CSS类的名称
ログイン後にコピー

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

$("#target").addClass("newClass"); 
//#target 指的是需要添加样式的元素的ID 
//newClass 指的是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") も提供します。ちなみに、フロントエンド開発の初心者に伝えたいのは、jquery は所有する価値があるので、時間があるときにじっくり勉強してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート