Question

<div class='class1'>
  <div class='class2'>
    <div class='class3'>
      some text
    </div>
    <div class='class4'>
      some text
    </div>
  </div>
</div>

我想在没有div.class1的情况下选择div.class4，但这不起作用。

$('.class1').not('.class4')

Answer 1

not('.class4')方法将从匹配元素集中删除具有类class4的元素。

如果您想过滤掉不包含.class1的{{1}}，请使用:not()和:has()伪类选择器的组合。

.class4

$('.class1:not(:has(.class4))').css('color', 'red')

更新：如果您想获取除<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class='class1'> <div class='class2'> <div class='class3'> some text </div> <div class='class4'> some text </div> </div> </div> <div class='class1'> <div class='class2'> <div class='class3'> some text </div> </div> </div>之外的元素内容，请使用clone()方法克隆该元素，请移除.class4并获取内容

.class4

console.log(
  $('.class1')
  // clone the element
  .clone()
  // get `.class4` elements
  .find('.class4')
  // remove them
  .remove()
  // back to previous selector
  .end()
  // get html content
  .html()
)

Answer 2

我想从div.class1中选择所有内容但不包含[...] div.class4

您可以使用属性选择器：

div[class]表示具有div属性的任何class。
div[class="class4"]表示div个class属性，其值为class4。
div[class!="class4"]表示任何div个class属性，其值为且不 class4。

所以你的选择器必须是：

div div[class!="class4"]

即。其他div内的任何div，其中类名不是class4。

工作示例：

＆＃13;

$(document).ready (

    function() {
        $('div div[class!="class4"]').css('borderWidth','3px');
    }
);

＆＃13;

div {
margin: 12px;
width: 50%;
border: 1px solid rgb(0,0,0);
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="class1">

<div class="class2">
<div class="class3">
some text
</div>
<div class="class4">
some text
</div>
</div>

</div>

＆＃13;

为了完整起见，这里是jQuery与javascript等价物......

<强> jQuery的：

    function() {
        $('div div[class!="class4"]').css('borderWidth','3px');
    }

<强>使用Javascript：

var selectedDivs = document.querySelectorAll('div div:not(.class4)');

for (var i = 0; i < selectedDivs.length; i++) {
    selectedDivs[i].style.borderWidth = '3px';
}

无法选择子div jQuery

2 个答案: