jQuery находит детей рекурсивно, но игнорирует определенные элементы

Question

Предположим, что следующий HTML

<div id=main>
   <div id=a></div>
   <div id=b></div>
   <div id=c></div>
   <div id=d>
      <div id=d1 class="no">
        <div id=d11></div>
        <div id=d12></div>
      </div>
   </div>
   <div id=e>
      <div id=e1 class="no">
        <div id=e11></div>
        <div id=e12></div>
        <div id=e13></div>
      </div>
   </div>
 </div>

Я хочу выбрать все теги div, которые являются дочерними элементами main, но хочу игнорировать дочерние теги div, у которых есть класс "no".

В настоящее время я написал рекурсивную функцию для выполнения этой работы. Но было интересно, если есть селектор jQuery, чтобы получить то, что я хочу.

Я хочу DIV с идентификаторами a,b,c,d,d1,e,e1

Спасибо

РЕДАКТИРОВАТЬ: создал тестовую страницу здесь - http://jsfiddle.net/mRENV/

Answer 1

В одном селекторе без дальнейшего обхода вы можете сделать это: $('#main div:not(div.no > div)');

Answer 2

Так должно быть:

$('#main div').not('.no div')

Btw. термин дети относится только к прямым потомкам элемента. Вы хотите, чтобы все потомки (не только дети) #main,

Ссылка: .not()

Изменить: Обновил демо, чтобы он работал должным образом: http://jsfiddle.net/fkling/mRENV/1/

Answer 3

Я предлагаю несколько синтаксических способов добиться этого с помощью jQuery:

var $result = $('#main').find('div:not(.no > div)');

Вызов .find() ^помочь вместе с псевдо :not()Селектор ^помощи. Эта строка эквивалентна:

var $result = $('#main').find('div').not('.no > div');

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