带有所选元素的子级的 JQuery 选择器 not()

Posted 2023-05-08

【中文标题】带有所选元素的子级的 JQuery 选择器 not()

【英文标题】：JQuery selector not() with children of selected elements

【发布时间】：2013-09-02 16:44:00

【问题描述】：

基本上添加了一些滑块功能，并且想将滑块扔到错误CSS类下以在某些情况下突出显示。

我正在编程工具提示以在句柄上方滑动，当添加错误样式时，我想将它扔到除这些句柄之外的所有元素上。句柄被封装在它们自己的<div class="tooltip"> 标签中，然而，当我调用选择器调用var div = $(this).find('div:not([class=.tooltip])'); 时，当我随后调用div.addClass("ui-state-error "); 时，这个封装的 div 类的子元素的样式会更新。

TL;DR：有没有办法调用not() 选择器，从而排除一个元素及其所有子元素。我知道显式列出子元素是一种快速的解决方法，但是 JQuery 库中是否有任何东西可以适应这种情况？

请注意，我有意避免使用 ID 标记，因为此控件最终会成为 ASP 用户控件，并且我想避免以后出现冲突的 ID 标记。

【参考方案1】：

试试这个：

$(this).find('div:not(.tooltip, .tooltip *)');

【讨论】：

这行得通。谢谢。我没有意识到选择器可以具有一些类似正则表达式的属性。检查了this，选择器似乎比我最初想象的更通用。然而，我记得读过的一件事是将事物封装在属性标签中是一种很好的做法。一点点阅读，我想出了替代方案div:not([class^=tooltip])

我不确定是否封装在属性标签中。自己看，类选择器更快：jsperf.com/attr-vs-class32