JQuery: фильтровать элементы через класс?

Ответ 1

hmm.. если у вас есть список вроде следующего:

<span class="apple">red apple</span>
<span class="apple">green apple</span>
<span class="pear">big pear</span>
<span class="pear">little pear</span>

показано следующее:

$("span.*").show();

следующее будет скрывать все элементы с помощью < class= "apple" ':

$("span[class='apple']").hide();

или вы можете скрывать все, что не имеет "class=" груша ":

$("span[class!='pear']").hide();

Ответ 2

Просто наткнулся на этот пост, я знаю, что он старый, но, честно говоря, ни один из этих ответов не очень полезен. На мой взгляд, вы можете фильтровать элементы с помощью фильтра с помощью: not, как в filter(':not()').

Как заявил Джоэл Поттер, используя $("span[class='apple']").hide();, выберете только те части с одним именем класса, apple. Если несколько классов присутствуют (что весьма вероятно), то такой подход не будет работать.

Если вы нажмете на слово, например. груши, вы можете затем отфильтровать элементы, которые не содержат класс pears.

$('span').show().filter(':not(.pears)').hide();

и все готово;)

Ответ 3

Чтобы отфильтровать элементы, содержащие данный класс или любое другое значение атрибута, использование Attribute Contains Word Selector будет хорошим решением:

$("span").filter("[class~='apple']")

Собственно, для атрибута класса еще проще просто написать:

$("span").filter(".apple") // or:
$("span.apple")

[Это также то, что Джоэл Поттер написал в своем комментарии к этому ответу.]

Таким образом, вы сможете сопоставить все ниже:

<span class="apple">...</span>
<span class="apple fruit">...</span>
<span class="fruit apple sweet">...</span>

Поэтому всякий раз, когда вы не на 100% уверены, что у вас будет только один набор классов для элемента, используйте оператор ~=.