WebDesign Dackel

jQueryでセレクタ名から条件を分岐

jQueryでセレクタ名から条件を分岐

Hatena0
Google+0
Pocket0
Feedly0

この前仕事でjQueryを書いていて、あるクラスを一斉に処理する中で<a>タグの時だけ、別の処理をしたいという事がありました。
その時、以下のコードを書いてFirefoxで確認したところちゃんと動作していたのですが、IEだかなんだかで動作していませんでした。

$('.className').each(function(){
  var clsName = $(this).get()[0].localName;
  if( clsName == "a" ){
    // <a>タグのみの処理
  } else {
    // 他のタグの処理
  }
});

ただ、このコードだと「localName」というプロパティが対応していないようで、タグの名前が取得出来ていませんでした。
タグの名前で分岐をしたいだけなら、jQueryの「is()」で解決出来ます。

$('.className').each(function(){
  if( $(this).is("a") ){
    // <a>タグのみの処理
  } else {
    // 他のタグの処理
  }
});

こんなに便利なメソッドがあるのは知りませんでした…。
勉強不足ですね。

このis()ですが、勿論タグだけでは無くてjQueryのセレクタに使用出来る全ての書式に対応していますので、色々な使い方ができます。

$(".className").each(function(){
    if( $(this).is(":first-child") ){
        // .classNameの最初の要素のみ

    } elseif( $(this).is(":last-child") ) {
        // .classNameの最後の要素のみ

    } elseif( $(this).is(":has(a)") ) {
        // aタグを持っている要素のみ

    } else {
        // それ以外の要素

    }
});