Wählen Sie nur (Anzeige: Block) Element aus der Liste der Elemente Jquery

Question

Ich mache ein Menü und ich muss ein bestimmtes Element aus einer Liste von Element von Jquery zurückgegeben werden.

Wenn i laufen auf der Konsole:

$("[type='subMenu']") 

Dies gibt 4-Anpassungs Untermenü Elemente.

<div type="subMenu" style="display:block"> 
<div type="subMenu" style="display:none"> 
<div type="subMenu" style="display:none"> 

Nun, ich brauche nur das Element wählen display:block

mit habe ich versucht,

$("[type='subMenu']").css('display') == 'block' 

aber false als Ausgabe geben.

und

$("[type='subMenu']").css('display') 

dies geben Ausgang als none

Answer 1

Andere geben bereits die JQuery :visible Selektor hingewiesen. Allerdings gibt es einige Performance-Probleme mit sich, wie in den JQuery API documentation wies darauf hin:

Zusätzliche Hinweise:

• Da :visible ist eine jQuery-Erweiterung und nicht Teil der CSS-Spezifikation, Abfragen mit :visible kann den Leistungsschub der systemeigenen DOM-Methode querySelectorAll() nicht nutzen. Um die beste Leistung zu erzielen, wenn Sie Elemente mit :visible auswählen, wählen Sie zuerst die Elemente mit einem reinen CSS-Selektor aus und verwenden Sie dann .filter(":visible").
• Die starke Verwendung dieses Selektors kann Auswirkungen auf die Leistung haben, da der Browser möglicherweise gezwungen wird, die Seite erneut zu rendern, bevor sie die Sichtbarkeit bestimmen kann. Das Verfolgen der Sichtbarkeit von Elementen mithilfe anderer Methoden, z. B. mithilfe einer Klasse, kann zu einer besseren Leistung führen.

Wenn Sie diese Probleme zu vermeiden, würde es vorziehen, können Sie eine native CSS-Selektor, stattdessen verwenden.Im Klar normalen JavaScript ‚ol, würde dies den Trick für Sie:

document.querySelector("[type=subMenu][style*=display\\:block]"); 

Oder, wenn Sie mehrere Elemente auswählen müssen:

document.querySelectorAll("[type=subMenu][style*=display\\:block]"); 

Ich glaube, das Äquivalent in JQuery (I don ‚t es verwenden) für beide wäre:

$("[type=subMenu][style*=display\\:block]"); 

Wenn die einzige Art, die jemals inline gesetzt werden auf diesen Tags ist display dann können Sie die * vomauslassenAttributselektor.

Answer 2

Sie Filter oder Pseudo-Klasse verwenden können.

$("[type='subMenu']").filter(function(){ 
    this.style.display == 'block'; 
}); 

Answer 3

Versuchen Sie folgendes:

console.log($("[type='subMenu']:visible")). 

Es werden alle sichtbaren Elemente