2009-12-25 1 views
68

получить все дивы, который имеет атрибут классаJQuery получить все дивы, которые не имеют атрибута класса

$('div[class]') 

получить все дивы, которые не имеют атрибута класса

$('div[class!=""]') 

Этот код работает, но я не» Понимаете, почему это работает. Если приведенный выше код работает, то код для всех разделов с атрибутом класса должен быть

$('div[class=""]') 

который не дает никакого результата.

ответ

136

Попробуйте с :not() pseudo-class selector:

$('div:not([class])') 

Редактировать

Описание для jQuery selectors сказать:

  • [attribute]
    Соответствует элементам, которые имеют указанный атрибут.
  • [attribute=value]
    Соответствует элементам, которые имеют указанный атрибут с определенным значением.
  • [attribute!=value]
    Матчи элементы, которые либо не имеют указанный атрибут или действительно имеют указанный атрибут, но не с определенным значением.

Это означает, что div[class=""] бы выбрать все элементы DIV, которые имеют атрибут class, указанный с пустым значением.

Но последний селектор является специализированным селектором jQuery, а не CSS selector. Вы должны были бы использовать :not(), чтобы выбрать все элементы DIV, которые не имеют класс:

div:not([class]) 
+0

хм. это не отвечает на поставленный вопрос. –

+14

@Scott Evernden: Ну, на самом деле я не вижу никакого вопроса. ;) – Gumbo

+0

Для нескольких случаев «не» вы можете сделать что-то вроде 'div: not ([class], [style])' – jocull

4

Селектор $('div[class=""]') по существу гласит: «Получить все элементы DIV которых атрибут класса имеет пустую строку в качестве значения.» - Это исключает все элементы div, которые имеют ЛЮБОЕ значение в атрибуте class, отличном от пустой строки, и все элементы div, которые вообще не имеют атрибута класса.

21

Что важно понимать, что есть пустого атрибутов класса, а также элементы без атрибута класса, но они требуют различных тестов, чтобы выбрать.

Существует множество тестов, которые все делают разные вещи.Вот наш HTML для наших тестов:

<div class="">Empty Class Attribute </div> 
<div class="column">Full Class Attribute </div> 
<div>No Class Attribute </div> 

Теперь, позволяет запускать наши тесты (Первая часть просто строка, которая помогает нам знать, что только что звонил в тревоге, в противном случае это не имеет смысла):

$(document).ready(function(e){ 
    // Outputs "Empty Class Attribute Full Class Attribute" 
    alert("div[class] : "  + $('div[class]').text() ); 

    // Outputs "Full Class Attribute" 
    alert("div[class!=''] : " + $('div[class!=""]').text()); 

    // Outputs "Empty Class Attribute" 
    alert("div[class=''] : " + $('div[class=""]').text() ); 

    // Outputs "No class Attribute" 
    alert("div:not([class]) : " + $('div:not([class])').text() ); 
}); 

вы можете просмотреть этот код в браузере при посещении здесь: http://jsbin.com/ijupu

Теперь, вооружившись этим знанием, если вы хотите, чтобы выбрать каждый div элемент на странице с либо пустой атрибут и атрибут, используйте следующий селектор:

$("div[class=''], div:not([class])"); 
-1

попробовать

jQuery('div[class^=""]') 

или

$('div[class^=""]') 

это значит получить все DIV, который имеет класс с любыми именами