So finden Sie Elemente, die mehreren Bedingungen entsprechen

Question

Was ich tun muss, ist alle Elemente auf der Seite finden, die "Tag" in der Eigenschaft href enthalten und der Text des Elements enthält ein bestimmtes Wort.

Zum Beispiel

<a href="/my/tag/item2">cars</a> 

Ich weiß, dass ich alle A-Elemente mit dem Tag in der href wie diese bekommen:

$("a[href*=tag]"); 

Ich kann auch alle A-Elemente mit 'Autos' in dem Text finden dies wie:

$("a:contains('cars')"); 

Aber wie kombiniere ich diese 2 Bedingungen in eine einzige Aussage, die sagt: Finden Sie alle Elemente, die 'tag' in der href enthalten und 'cars' im Text enthalten?

Answer 1

Haben Sie versucht $("a[href*=tag]:contains('cars')");?

Sie können auf und für immer diesen Weg gehen, das heißt

$("a.className.anotherClass[href*=tag][title=test]:contains('cars'):visible"); 

Answer 2

Wie die anderen Jungs gesagt oder, wenn die beiden Bedingungen müssen separat angewendet werden, mit einem anderen Code in zwischen zum Beispiel dann. ..

var $tags = $("a[href*=tag]"); 

dann später ...

var $carTags = $tags.filter(":contains('cars')"); 

.filter() ist die verallgemeinerte Methode zum Reduzieren einer vorhandenen jQuery-Auswahl.

Wie viele andere jQuery Methoden .filter() ein jQuery-Objekt zurückgibt, so wird es Kette:

var $foo = $("a[href*=tag]").filter(":contains('cars')").filter(".myClass"); 

.filter() ist auch gut für die Gründe, warum ich nicht im Begriff war, zu erklären, und ich brauche nicht zu, weil @ bažmegakapa hat das gerade sehr eloquent getan.

Answer 3

Die anderen Antworten zeigen schöne und funktionierende Beispiele. Aber es gibt eine interessante Eigenart hier, die Unterscheidung zwischen native CSS selectors (die auch von der nativen querySelectorAll() unterstützt wird) und selectors defined by jQuery.

Mischen sie möglicherweise nicht glücklich, weil dann die viel schnellere native Engine nicht verwendet werden kann. Zum Beispiel auf :has() den jQuery docs Zustand:

Denn: hat() ist eine Erweiterung jQuery und nicht Teil der CSS Spezifikation, Abfragen mit: hat() kann nicht die Vorteile der Leistungssteigerung durch die bereitgestellte nehmen Natives DOM querySelectorAll() Methode.

Aus diesem Grunde können Sie auch mit der nativen Methode Abfrage besser dran, und dann filtering durch alle jQuery spezifische Selektoren:

var $res = $("a[href*=tag]").filter(":contains('cars')");