Donnerstag, April 9, 2020

So finden Sie ein element per style-Attribut?

Ich habe Probleme beim abrufen von Elementen, die durch style-Attribut.
Ich habe eine ul mit mehreren li Elemente und ich würde gerne denjenigen finden, der mit dem style-atribute, die einen Wert display:list-item. Ich habe versucht, diesen Ansatz in einigen weisen, einschließlich der folgenden, aber ich bekomme immer ein leeres Objekt. Ich habe kein problem mit einem title-Attribut. Nicht sicher, was ich falsch mache.

$('li[style*=display:list-item]')

HTML:

<ul class="bjqs" style="height: 200px; width: 100%;">
    <li class="bjqs-slide" style="height: 200px; width: 100%; display: list-item;">
  • dies scheint wie eine schlechte Idee. sind Sie sicher, dass es notwendig ist? warum kann man nicht einfach bekommen .bjqs-slide?
  • Ich habe mehrere .bjqs-slide li-Elemente und ich will etwas tun mit dem, hat dieses Attribut.
InformationsquelleAutor user2232681 | 2013-10-24

2 Kommentare

  1. 4

    Zwei Probleme:

    1. In Ihre HTML-es ist ein Leerzeichen zwischen „display“ und „list-item“.
    2. Ihre Selektor muss gewickelt werden, mit Zitaten "".

    Einfach ändern Sie Ihre Auswahl, um diesen Bereich einschließen und wickeln Sie es in Anführungszeichen:

    $('li[style*="display: list-item"]')

    JSFiddle demo.

    • Mir ist auch aufgefallen, dass ich war auf der Suche nach diesem element, bevor es erstellt wurde, durch ein plug-in, das glaube ich verschärft mein problem. Wenn ich den Leerraum, wie Sie vorgeschlagen und zog es nach unten ein paar Zeilen, Erfolg. Danke.
    • glücklich zu helfen! 🙂
  2. 6

    Ihre Selektor ist white-space empfindlich ist, gegeben, dass Sie haben weiße Raum, in dem Attribut, das Sie benötigen, die in Ihrer Auswahl als auch:

    $('li[style*="display: list-item"]')

    Der einfachste Weg, das reduziert die Probleme der genau passend ein string, wenn Sie filtern Elemente nach einem bestimmten CSS-Eigenschaft ist verwenden filter():

    $('li').filter(function(){
        return $(this).css('display') === 'list-item';
    });

    Referenzen:

Kostenlose Online-Tests