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

Question

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

这是否可以仅使用 CSS 完成？还是需要涉及 JQuery？

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

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

小提琴

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

Answer 2

这是一种条件格式，对吧？如果是这样，您唯一的选择似乎是 Javascript，并且通过谷歌搜索有很多选择。这是顶部的谷歌链接：https ://gist.github.com/rdrgrtz/1082791