classが存在するかどうか調べて分岐するJQuery

JQueryで特定のクラスが存在していればAを、存在していなければBをみたいなことはしょっちゅうやっていますが、その方法です。クラスを動的に追加している場合などに重宝するコードです。

クラスがあるかどうかのチェックは、$(".class名").length で可能です。

下のコードは、ページをスクロールをした際に何か動的に生まれたクラスがあればA、存在していなければBのようなケース。

$(function() {
	$(window).scroll(function () {
		if($(".new-class").length){
			ここにAのコードを書く
		}
		else {
			ここにBのコードを書く
		}
	});
});

より具体的な例として、下にスクロールして何かクラスが現れたらサイトのロゴの画像を変えて、ページの先頭に戻ったらまた画像を元に戻すみたいな場合のコードを書きます。

$(function() {
	$(window).scroll(function () {
		if($(".new-class").length){
			$("h1 > img").attr({"src":"スクロールした時の画像のパス"});
		}
		if($(window).scrollTop()==0){
			$("h1 > img").attr({"src":"初期値の画像のパス"});
		}
	});
});