CSS数据属性条件值选择器？

Question

给出html如：

<div data-points="800">Jonh</div>
<div data-points="200">Jack</div>
<div data-points="1200">Julian</div>

如何选择元素的价值优于1000（x> 1000）？

偏好：通过CSS选择器。如果没有这样的话，那么我将重新询问JQuery / JS的答案。

---

最终使用：

var x = 1000;
$("div").each(function() {
    if ($(this).attr('data-points') > x) {
        $(this).addClass('larger-than-x'); // Or whatever
    }
});

Answer 1

使用CSS，您可以选择具有其属性的元素：

div[data-points] {  }

或其属性的值：

div[data-points="800"] {  }

但你不能在CSS中使用条件 我建议你使用javaScript解决方案解决这个问题，这很容易，例如，使用jQuery你可以做类似的事情：

$("div[data-points]").each(function() {
    if ($(this).attr('data-points') > 1000) {
        $(this).addClass('larger-than-1000'); // Or whatever
    }
});