从DOM选择中排除元素及其后代

Question

如何使用CSS或jQuery选择除给定元素及其后代之外的所有DOM元素？

说给定元素是#test

$('#test *')将返回所有#test后代

- 但 -

$('* :not(#test))')或$('* :not(#test *))')或$('*').not('#test')或$('*').not('#test *')

不起作用！

修改 我想在点击页面上的任何位置但#test区域时触发点击事件。

Answer 1

  

我想在点击页面上的任意位置时触发点击事件，但#test区域。

然后你不需要将click绑定到每个元素...只需绑定到文档并检查它是否被$('#test, #test *')命中，如果是，则中止点击处理程序：

$(document).on('click', function(e) {
    if ($(e.target).is('#test, #test *')) {
        return;
    }

    // Do stuff
});

jsFiddle preview

Answer 2

在点击事件中，检查点击是否在#test：http://jsfiddle.net/QDNCS/

内

$(document).click(function(e) {
    if (!$('#test')[0].contains(e.target)) {
        alert('Yay!');
    }
});​

Answer 3

系统重启已关闭：

$('*').not('#test, #test *')

尽管如此，我不会将事件绑定到该选择器 - 它可能会选择太多元素并使您的网站工作缓慢。如果发生这种情况，请考虑使用jquery的live()代替。

Answer 4

我不知道确切的jQuery代码，但是这个jQuery脚本似乎就是你要找的。

http://benalman.com/projects/jquery-outside-events-plugin/

希望这有帮助

Answer 5

您可以将@The System Restart和@topp的答案组合起来以获取所请求的行为：

$(document).on('click', function (e) {
    if ($(this).is('#test, #test *')) {
        return;
    }
}

注意我还没有测试过这段代码。