JQuery: Можно ли выбирать элементы только с одним классом из числа элементов с потенциально тремя классами?

Например, скажем, что у меня есть следующее:

<span class="a b c">Has class a, b, and c</span>  
<span class="a">Has class a</span>  
<span class="b c">Has class b and c</span> 
<span class="a c">Has class a and c</span> 
<span class="a c">Has class a and c</span> 
<span class="a">Has class a</span>

Теперь предположим, что я хочу выбрать все элементы, которые имеют only класс a.
Значение будет выбрано только вторым и последним span.
Есть ли простой способ сделать это?

Ответы

Ответ 1

$('.a').not('.b, .c')

Это выберет все элементы с классом a, у которых нет b или c. Тем не менее, они все еще могут иметь класс d, e и т.д. Используйте ответ Фила, если вы действительно хотите только элементы без класса, отличного от a.

Ответ 2

(см. ниже, почему вы, возможно, не захотите делать то, что задано в вопросе)

Вы можете использовать атрибут [class="a"] "равно селектору", хотя он хрупкий:

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

Проблема в том, что если у вас есть какие-либо пробелы в атрибуте класса, это сломается. Смотрите эту скрипту: http://jsfiddle.net/c7DP7/

Вы можете исправить это, выполнив базовый запрос по этим элементам, используя обычный селектор классов, затем дополнительно отфильтруйте их, проверяя только a (и обрезая пробелы в этом втором фильтре). Смотрите эту скрипту: http://jsfiddle.net/uD48E/1/

$('.a')
    .filter(function(index){
        return $(this).attr("class").trim() == "a";
    })
    .hide();

Вопрос выглядит так, будто он пытается сделать более "будущий доказательство", но этот конкретный подход более хрупкий. Отклонение всех классов, которые не связаны с текущим классом, который вы фильтруете, может портить вещи по причинам, не связанным с классом a (например, несвязанный класс d или e, который добавляется позже). Это важно, если HTML-код, который вы применяете в jQuery, может быть изменен в будущем.

Лучший способ сделать это - отфильтровать только классы, которые влияют на значение класса a. Предоставление такой гибкости - вот что делает ваш код более надежным в будущем. Подробнее о том, как это сделать, см. maxedison.

Ответ 3

Я полагаю, что если вы хотели сделать это, вы могли бы просто сделать:

var spans = $("span[class='a']");

Ответ 4

Другой метод - удалить эти классы, а затем проверить, остаются ли какие-либо классы. Если нет, выполните функцию:

JS Fiddle

$('.a').each(function () {
    var $this = $(this);
    if (!$this.removeClass('a').attr('class').length) {
       //Execute function here
    }
});