Jquery: So überprüfen Sie, ob das Element eine bestimmte CSS-Klasse / einen bestimmten CSS-Stil hat

85

Ich habe eine div:

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

Gibt es eine Möglichkeit zu überprüfen, ob das bestimmte Element:

$("#someElement")

hat eine bestimmte Klasse (in meinem Fall "Test").

Gibt es alternativ eine Möglichkeit zu überprüfen, ob en element einen bestimmten Stil hat? In diesem Beispiel möchte ich wissen, ob das Element " position: absolute" hat.

Vielen Dank!

javascript jquery css 0100110010101
quelle
14
Ich bin mir nicht sicher, ob die Frage oder die Antwort falsch ist, aber die Frage hat style = "test" und die Antwort sucht nach class = "test"
whereesrhys
1
Ich vermute, die Frage ist falsch, da er die falsche Antwort als richtig markiert hat; Aber unabhängig davon, nachdem ich mir die Stimmen angesehen habe, denke ich, dass die meisten Leute hier gestolpert sind, um nach der richtigen Antwort auf diese falsche Frage zu suchen ... ähm, wenn das irgendeinen Sinn ergibt ... Die Antwort von DrJokepu meine ich. Deshalb bin ich zumindest hier.
BrainSlugs83

Antworten:

58 
if($('#someElement').hasClass('test')) {
  ... do something ...
}
else {
  ... do something else ...
}
Darin Dimitrov
quelle
74
Dies beantwortet die gestellte Frage nicht - siehe die Antwort von DrJokepu unten.
Ryan Burney
279

CSS-Stile sind Schlüssel-Wert-Paare, nicht nur "Tags". Standardmäßig ist jedem Element ein vollständiger Satz von CSS-Stilen zugewiesen. Die meisten von ihnen verwenden implizit die Standardeinstellungen des Browsers und einige von ihnen werden in CSS-Stylesheets explizit neu definiert.

So erhalten Sie den einem bestimmten CSS-Eintrag eines Elements zugewiesenen Wert und vergleichen ihn:

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

Wenn Sie den Stil nicht neu definiert haben, erhalten Sie den Browser-Standard für dieses bestimmte Element.

Tamas Czinege
quelle
3
Es gibt keine Möglichkeit, dies mit einem Selektor zu tun?
BrainSlugs83
Hiermit können Sie sehen, was die eigentliche Eigenschaft ist. Ich muss wissen, ob diese Eigenschaft direkt festgelegt wird oder ob sie vom CSS-Stil / Browser geerbt wurde. Ist das möglich?
ante.sabo
Scheint für das Szenario nicht zu funktionieren, wenn sich der DOM-Wert / CSS-Wert eines Objekts nach dem Laden der Seite ändert. Haben Sie eine Idee, wie Sie CSS-Änderungen nach dem Laden des DOM beobachten können?
Schlüsselbein
@Collarbone Sie können setTimeout () und clearTimeout () jederzeit verwenden, um den Aufruf nach dem Laden des Dokuments um etwa eine Sekunde zu verzögern.
Probie
13 
if ($("element class or id name").css("property") == "value") {
    your code....
}
Sandeep Gupta
quelle
4

Wenn Sie auf das Element zugreifen müssen, das diese Eigenschaft hat und keine ID verwendet, können Sie diesen Weg gehen:

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

Ich habe eine Lösung gefunden:

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

aber irgendwie glaube ich, dass es einen besseren weg gibt!

0100110010101
quelle
1

Die Frage stellt zwei verschiedene Dinge:

  1. Ein Element hat eine bestimmte Klasse
  2. Ein Element hat einen bestimmten Stil.

Die zweite Frage wurde bereits beantwortet. Für den ersten würde ich es so machen:

if($("#someElement").is(".test")){
    // Has class test assigned, eventually combined with other classes
}
else{
    // Does not have it
}
Mario Vázquez
quelle