ASP.NET JavaScript jQuery プログラミング

【 jQuery 】hasClass メソッドの使用方法 / 条件分岐の方法

今回はjQueryのhasClassメソッドとは何か、そしてその使用方法について解説していきたいと思います。

また、ASP.NET環境下での便利な使用方法も解説したいと思います。

例えば、お気に入り機能があるECサイトがあって、

そのユーザが商品をお気に入り登録ボタンをクリックした時にポップアップが表示されるjQueryのイベントがあるとします。

hasClassメソッドとは

jQueryのメソッドには、「hasClass」というものがあります。

hasClassは、あるWebページの要素に対してメソッドの引数で指定したclassが存在するかを確認することができる便利なメソッドです。

指定したclassが存在した場合は真(true)、存在しない場合は偽(false)の真偽値を返します。

hasClassメソッドの使用方法

hasClassメソッドは以下のように使用することができます。

$('element').hasClass('className')

上記の場合、'element'に対象となる要素、'className'にelementに指定した要素に存在するか確認したいclass名を指定します。

また、もしclassを複数指定したい場合は、以下のようにclass名を半角スペースで区切って指定することで判定することができます。

$('element').hasClass('class1 class2 class3 class4')

hasClassメソッドを使用した条件分岐の方法

今回の記事の最初に解説した通り、hasClassメソッドは対象の要素に対して指定したclassが存在するかを判定して、
その結果を真偽値で返してくれるので、その存在するかの結果によって実行する処理を条件分岐させることができます。

実際にhasClassメソッドを使用した条件分岐の方法は以下になります。

if( $('element').hasClass('className') ) {
    #classが存在する場合の処理を書く(返却値=true)
} else {
    #classが存在しない場合の処理を書く(返却値=false)
}

おすすめ記事はコチラ

ASP.NET Web Forms 1

この記事ではマイクロソフト社が開発・提供しているWebアプリケーション開発用フレームワーク「ASP.NET」の「Web Forms」を「MVC」と比較しながらメリットやデメリット等を含めて解説していき ...

C#VB 2

今回はC#(ver.7.0以降)、VB(ver. 15以降)でforeachループ内で繰り返し回数を参照する方法について解説していきます。 従来の記述方法とよりスマートに記述する方法の2通りを以下にな ...

3

この記事ではSQL Serverで使用できる「STUFF」という便利な関数の使い方について、解説していきます! 他にも便利な関数があれば、別記事にて使用方法を解説していきたいと思います! STUFF ...

4

今回はSQL ServerでデータをXML形式で取得する方法について書いていきます。 FOR XML PATH SQL Serverには「FOR XML PATH」という関数があって、SQL分の末尾に ...

-ASP.NET, JavaScript, jQuery, プログラミング
-, ,