Question

考虑这个DOM：

<div id="div1">
  <div class="no-select-inside">
    <p>Don't select me</p>
  </div>
  <div>
    <p>Select me</p>
    <div><p>Select me too</p></div>
  </div>
  <div>
    <p>Select me</p>
    <div><p>Select me too</p></div>
  </div>
  <footer class="no-select-inside">
    <p>Don't select me</p>
    <div><p>Not me</p></div>
  </footer>
  <section>
    <p>Select me</p>
    <div><p>Select me too</p></div>
  </section>
</div>

我想要一个快速和可靠 jquery（或裸DOM）选择器来选择那些不在'no-select-inside'类中的p标签

一切都是动态的，但我可以为不可选择的DOM元素分配一个属性。

修改

真正的测试用例不是类选择器（可能是复杂的属性选择器，......）

一切都是动态的，并且嵌套得太深（100到no-select-inside下的DOM树，p有一个no-select-inside父级，所有答案都是选择的）

我已经缓存了所有no-select-inside（Backbone的$ el并且可以缓存在数组中以提高性能）但真正的问题是以快速的方式选择这些元素（Chrome中的20ms太慢了！）。

Answer 1

通用解决方案是filter那些拥有.no-select-inside祖先的解决方案，例如：

$("p")
    .filter(function() { return !$(this).closest(".no-select-inside").length;})
    // and now do what needs to be done

这应该是合理有效的，因为它只会在整个文档上进行一次。

Answer 2

尝试使用.not()或:not()过滤掉p

中的no-select-inside个元素

$('#div1 p').not('.no-select-inside p')
$('#div1 p:not(.no-select-inside p)')

Answer 3

试试这个：

$('div:not(.no-select-inside) p')

Answer 4

You can use .not as the working example is here 

$(document).ready(function(){
     var abc = $('#div1').find("p").not('.no-select-inside p');
     $(abc).each(function(e){
        alert($(this).html());
     }); 
 });

http://jsfiddle.net/8F7Kc/14/

jQuery选择器忽略指定的元素

修改

4 个答案: