选择元素，其中属性非空

Question

假设我有以下几点：

<div data-pid="">Unknown</div> 
<div data-pid="123">Known 123</div> 

是否有CSS的方式只选择元素，其中的data-pid属性非空？

Answer 1

这工作，如果你不介意做的事情略有倒退，你需要在浏览器中的工作不支持:not：

div[data-pid] { 
    color: green; 
} 

div[data-pid=""] { 
    color: inherit; 
} 

这将让所有的div s的非空data-pid s绿色。

小提琴这里：http://jsfiddle.net/ZuSRM/

Answer 2

相貌丑陋，但这样的事情应该这样做：

[data-pid]:not([data-pid=""]) 

jsFiddle Demo

随着一点点的Javascript，你也可以添加类，如果你需要支持旧的浏览器。

Answer 3

/* Normal styles */ 
[data-pid] {} 

/* Differences */ 
[data-pid=""] {} 

jsFiddle。

这将有更好的浏览器支持。而不是选择你想要的，把它们全部样式化，然后把差异放在第二个选择器中。