css - 如果表格单元格包含大于 "x"的数字，是否可以将其作为第 n 个子单元格？

Question

我目前有一个包含一些动态生成数据的表格，如果单元格中包含的数字大于该数字，我想突出显示一个表格行，比如说“50”。

这是仅用 CSS 就可以完成的事情吗？还是 JQuery 需要参与？

目前我只是使用这个 CSS 来帮助在视觉上分隔每一行。

.data tr:nth-child(odd){
    background-color:#eeeeee;
}

Fiddle

Answer 1

这在纯 CSS 中是不可能的。使用 CSS，您无法获取 innerHTML。

您必须使用 javascript 或 jQuery。

需要一个简单的循环

$('td').each(function () {  //loop through each tds
    if (+$(this).text() > 50) { // + is used to parse it to integer type
        $(this).css('background-color', 'red')
    }
});

JSFiddle