为什么.not（）在这种情况下不起作用？

Question

我一直在拼命试图弄清楚为什么.not（）在这种情况下不起作用

链接： http ： //jsfiddle.net/Kr8SA/4/

谢谢您的帮助。

 $('#site').not('#box') .fadeIn(); 

 #site { display: none; } div { border: 2px solid black; width: 300px; height: 300px; } #box { background: gray; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="site"> <div id="box"></div> <div></div> </div> 

Answer 1

.not函数不会在给定集合的所有后代中搜索。 它从集合中过滤元素。 由于$('#site').length == 1 ，它将无法正常工作。

两种选择是

• $('#site *').not('#box')
• $('#site').find('*:not(#box)')

 $('#site *').not('#box').fadeIn() 

 /* Hide the elements we'll fade in */ #site *{ display: none; } div { border: 2px solid black; width: 300px; height: 300px; } #box { background: gray; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="site"> <div id="box"></div> <div>Something to show</div> </div> 

Answer 2

.not()用作当前查询结果的排除过滤器，而不是子级或其他后代。 您的查询仅包含#site 。 因此，告诉jQuery使用.not()排除#box不会执行任何操作。

您的查询内容如下：

• 包含#site ，我们的查询结果现在仅包含#site
• 排除#box ，我们的查询不包含#box所以什么也不做
• 我们的最终查询结果仍然只包含#site