CSS: Как исключить DIV и его потомков?

#css #jquery-selectors

#css #jquery-селекторы

Вопрос:

У меня есть html, который выглядит следующим образом:

 <div id="mainDiv">
    <div id="childDiv1">
        <img />
        <div>
            <img />
            <div />
        </div>
        ...
    </div>
    <div id="childDiv2">
        ...
    </div>
    ...
</div>
  

Я хочу выбрать все в mainDiv, кроме childDiv1 и его потомков. Я думал, что это #mainDiv :not(#childDiv1) может сработать, но это исключает только chidlDiv1 , пока выбираются все его потомки. #childDiv1 * будут выбраны все потомки (но не сам childDiv1), но :not(#childDiv1 *) недопустимо.
Решение jQuery было бы предпочтительнее. Спасибо

Ответ №1:

Думаю, это работает:

 $("#mainDiv > :not(#childDiv1)")
  

Ответ №2:

Попробуйте это:

 $("#mainDiv :not(#childDiv1), #childDiv :not(*)")
  

Ответ №3:

если какие-либо дочерние элементы mainDiv находятся в формате div.

 $('#mainDiv div:gt(0)')