2013-03-06 21 views
7

Quello che devo fare è trovare tutti gli elementi nella pagina che contengono "tag" nella proprietà href e il testo dell'elemento contiene una determinata parola.Come trovare elementi che corrispondono a più condizioni

Per esempio

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

so di poter ottenere tutti un elementi con tag nel href come questo:

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

posso anche trovare tutti gli elementi a con 'cars' nel testo In questo modo:

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

Ma come si combinano queste due condizioni in una singola istruzione che dice: Trova tutti gli elementi che contengono 'tag' nell'href e contengono 'cars' nel testo?

risposta

15

Hai provato $("a[href*=tag]:contains('cars')");?

Si può andare avanti e avanti per sempre in questo modo, cioè

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

io non lo sapevo. Funziona. – Dmitri

3

Come gli altri ragazzi ha detto o, se devono essere applicate separatamente, con qualche altro codice in mezzo ad esempio le due condizioni, allora. ..

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

poi ...

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

.filter() è la generalizzata metodo per ridurre una selezione jQuery esistente.

Come molti altri metodi di jQuery .filter() restituisce un oggetto jQuery in modo da esso catena:

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

.filter() è anche un bene per ragioni che non aveva intenzione di spiegare, e non hanno bisogno di perché @ bažmegakapa l'ha appena fatto molto eloquentemente.

+0

Un'altra bella caratteristica che ora sapevo. – Dmitri

+0

+1 sembra che stiamo parlando della stessa cosa :) – kapa

3

Le altre risposte mostrano esempi raffinati e operativi. Ma c'è una stranezza interessante qui, la distinzione tra native CSS selectors (che sono anche supportati dal nativo querySelectorAll()) e selectors defined by jQuery.

Mischiandoli potrebbe non essere una fortuna, perché quindi il motore nativo molto più veloce non può essere utilizzato. Ad esempio, su :has() jQuery docs Stato:

causa: ha() è un'estensione di jQuery e non fa parte della specifica CSS , query utilizzando: ha() non può sfruttare la spinta prestazioni fornite dal metodo DOM querySelectorAll() nativo.

Per questo motivo, si potrebbe meglio fuori l'interrogazione con il metodo nativo e poi filtering utilizzando qualsiasi selettore jQuery specifici:

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

+1 Bella spiegazione. Dovrebbe essere sulla lista di lettura di ogni jQuery newbie. –

Problemi correlati