多不（）DOM选择器

Question

我要选择有两个条款没有一个特定的节点，但我没有成功为止。我需要做的是，选择一个元素，其div包含字符串0008，但它不是10008，也确实不包含标记的“风格”，因此，在理论上它应该工作就像是：

document.querySelectorAll(" div[id*='0008']:not([id='10008'][style])") 

但是，正如您可能会怀疑的那样，它不会那样工作。

document.querySelectorAll(" div[id*='0008']:not([id='10008'])") 
document.querySelectorAll(" div[id*='0008']:not([style])") 

当然，它们都能单独工作。

Answer 1

jsFiddle Demo

从逻辑上讲，你想排除匹配任何两个干扰选择，不符合他们两个是元素的元素。在jQuery中，multiple selector（然后匹配所有不需要的元素，然后被否定）只是一个逗号分隔的列表。因此，你只需做到这一点：

$("div[id*='0008']:not([id='10008'],[style])") 

从jQuery docs（因为这个问题被标记的jQuery）：

所有选择接受内部:not()，例如：:not(div a)和:not(div,a)。

Answer 2

我只是做：

var elems = $('div[id*="0008"]').filter(function() { 
    return !this.hasAttribute("style") && this.id == '10008'; 
}); 

我不认为我真的得到这个，但是这会过滤掉：

<div id="10008" style="color: black">10008</div> 

但不是：

<div id="10008">10008</div> 

ID的ID当然是独一无二的，并且可能有一个真实世界的用例，但它直到看起来像你通常以其他方式处理的边缘案例，因为一旦你过滤了ID，为什么你还需要匹配样式标签呢？

Answer 3

不是10008，也它不...

这不是你目前选择的检查，它测试它是否有没有（ID和样式属性）。使用这个来代替：

div[id*='0008']:not([id='10008']):not([style]) 

你原来的解决方案还没有一个有效的选择，因为:not() may only contain one simple selector，而你有两个。然而，像jQuery的sizzle引擎那样的选择库可能会是support them。所以使用jQuery，下面的工作，以及：

div[id*='0008']:not([id='10008'],[style])