Jquery:要素に特定のcssクラス/スタイルがあるかどうかを確認する方法


85

私はdivを持っています:

<div class="test" id="someElement" style="position: absolute"></div>

特定の要素があるかどうかを確認する方法はありますか?

$("#someElement") 

特定のクラス(私の場合は「テスト」)があります。

あるいは、en要素が特定のスタイルを持っていることを確認する方法はありますか?この例では、要素に「position: absolute」があるかどうかを知りたいです。

どうもありがとうございました!


14
質問なのか間違った答えなのかはわかりませんが、質問にはstyle = "test"があり、答えはclass = "test"を探します
wheresrhys 2009

1
私の推測では、彼は間違った答えを正しいとマークしたので、質問は間違っています。しかし、それにもかかわらず、投票を見た後、ほとんどの人がこの間違った質問に対する正しい答えを探してここにつまずいたと思います...ええと、それが理にかなっているなら... DrJokepuからの答え、つまり。それが私が少なくともここにいる理由です。
BrainSlugs83 2012年

回答:



281

CSSスタイルは、単なる「タグ」ではなく、キーと値のペアです。デフォルトでは、各要素にはCSSスタイルの完全なセットが割り当てられており、それらのほとんどは暗黙的にブラウザーのデフォルトを使用しており、一部はCSSスタイルシートで明示的に再定義されています。

要素の特定のCSSエントリに割り当てられた値を取得し、それを比較するには:

if ($('#yourElement').css('position') == 'absolute')
{
   // true
}

スタイルを再定義しなかった場合は、その特定の要素のブラウザのデフォルトを取得します。


3
セレクターでそれを行う方法はありませんか?
BrainSlugs83 2012年

これであなたは実際のプロパティが何であるかを見ることができます、私が知る必要があるのはこのプロパティが直接設定されているのか、それともcssスタイル/ブラウザから継承されているのか...それは可能ですか?
ante.sabo 2012

ページの読み込み後にオブジェクトのDOMが変更されたり、cssの値が変更されたりした場合、このシナリオでは機能しないようです。DOMがロードされた後にcssの変更を監視する方法はありますか?
鎖骨2016

@CollarboneいつでもsetTimeout()とclearTimeout()を使用して、ドキュメントが読み込まれた後、呼び出しを1秒ほど遅らせることができます。
probie 2018


4

または、そのプロパティを持つ要素にアクセスする必要があり、IDを使用しない場合は、次のルートを使用できます。

$("img").each(function () {
        if ($(this).css("float") == "left") { $(this).addClass("left"); }
        if ($(this).css("float") == "right") { $(this).addClass("right"); }
    })

1

私は1つの解決策を見つけました:

$("#someElement")[0].className.match("test")

しかし、どういうわけか私はより良い方法があると信じています!


1

質問は2つの異なることを求めています:

  1. 要素には特定のクラスがあります
  2. 要素には特定のスタイルがあります。

2番目の質問はすでに回答済みです。最初のものについては、私はそれをこのようにします:

if($("#someElement").is(".test")){
    // Has class test assigned, eventually combined with other classes
}
else{
    // Does not have it
}
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.