2013-03-06 5 views
7

Что мне нужно сделать, это найти все элементы на странице , которые содержат «тег» в свойстве href, а текст элемента содержит определенное слово.Как найти элементы, соответствующие нескольким условиям

Например

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

Я знаю, что я могу получить все-элементы с тегом в HREF, как это:

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

Я также могу найти все-элементы с «авто» в тексте как это:

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

Но как я совмещаю эти 2 условия в одном заявлении, которое говорит: Найдите все элементы, содержащие «тег» в href и содержащие «автомобили» в тексте?

ответ

15

Вы попробовали $("a[href*=tag]:contains('cars')");?

Вы можете пойти дальше и навсегда, что путь, т.е.

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

я не знаю, что. оно работает. – Dmitri

3

Как говорили другие ребята, или, если два условия должны применяться отдельно, с другим кодом между, например, тогда. ..

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

потом ...

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

.filter() является обобщенным метод для сокращения существующего выбора jQuery.

Как и многие другие методы JQuery .filter() возвращает объект JQuery так будет цепочка:

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

.filter() также хорош по причинам, я не собирался объяснять, и я не нужно, потому что @ bažmegakapa только что сделал это очень красноречиво.

+0

Еще одна приятная особенность, о которой я теперь знал. – Dmitri

+0

+1 похоже, что мы говорим о том же :) – kapa

3

Другие ответы показывают прекрасные и рабочие примеры. Но здесь есть интересная причуда, разница между native CSS selectors (которые также поддерживаются родным querySelectorAll()) и selectors defined by jQuery.

Смешать их, возможно, не повезло, потому что тогда более быстрый собственный двигатель не может быть использован. Например, на :has() Jquery Docs состояния:

Потому что: есть() является расширением JQuery и не является частью спецификации CSS , запросы с использованием: есть() не может воспользоваться повышением производительности, предоставляемой родной запрос DOMSelectorAll() способ.

По этой причине, возможно, лучше запрашивая с нативным методом, а затем filtering с помощью каких-либо конкретных селекторы JQuery:

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

+1 Хорошее объяснение. Должен быть в каждом списке чтения новичка jQuery. –