要素がクラスを持っているかどうかjQueryチェック

Question

HTML要素にクラスがあるかどうかを調べたい場合は、jQueryで関数を実行します。私のコードは、要素が複数のクラスを持たない場合にのみ機能します。私は.hasClass()メソッドを使う必要があると信じていますが、わかりませんでした。

var pageClass = $("body").attr('class'); 
switch (pageClass) { 
    case ("page1"): 
    $('h1').html('heading1'); 
    break; 
    case ("page2"): 
    $('h1').html('heading2'); 
    break; 
    default: 
    $('h1').html('default'); 
} 

フィドル： https://jsfiddle.net/9o70dbzz/2/

Answer 1

これは、セレクタで解決することができます。

$('h1').html('default'); 
$('body.page1 h1').html('heading1'); 
$('body.page2 h1').html('heading2'); 

Answer 2

.hasClass()機能を使用してください。

if($("body").hasClass("page1")){ 
    $("h1").html("heading1"); 
} 
else if($("body").hasClass("page2"){ 
    $("h1").html("heading2"); 
} 
else { 
    $("h1").html("default"); 
} 

Answer 3

私は、このような方法でそれを行うだろう....

代わりにswitch文の使用の

$(document).ready(function() { 
var element = $("body"); 

var classesCollection = { 
    'page1': 'heading1', 
    'page2': 'heading2' 
}; 

for (var propertyName in classesCollection) { 
    var propertyValue = classesCollection[propertyName]; 
    if (element.hasClass(propertyName)) element.html(propertyValue); 
    else element.html('default'); 
} 

}); 

https://jsfiddle.net/9o70dbzz/4/