选择器，其中jquery中的表td:包含null

我有一张桌子，上面有一些“时间表”：

+------------------------------------------+                     KEY:
|NAME 00:00  00:20  00:40  01:00  01:20 etc            XXXXXXX is actually 'itemA'
|item XXXXXXXXXXXX  YYYYYYYYYYYYYYYYYYY                YYYYYYY is actually 'itemAB'
|item YYYYYYYYYYYYYYYYYYY  XXXXXXXXXXXX                ZZZZZZZ is actually 'itemABC'
|item ------------  ZZZZZZZZZZZZ  XXXXX                ------- is actually null/blank

由以下各项组成：

<table>
   <tr>
      <th>NAME</th><th>00:00</th><th>00:20</th><th>00:40</th><th>01:00</th><th>01:20</th><th>etc</th>
   </tr>
   <tr id="row1">
      <th>item</th>
      <td colspan="2">itemA</td>
      <td colspan="3">itemAB</td>
   </tr>
   <tr>
      <th>item</th>
      <td colspan="3">itemAB</td>
      <td colspan="2">itemA</td>
    </tr>
   <tr>
      <th>item</th>
      <td colspan="2"></td>
      <td colspan="2">itemABC</td>
    </tr>
</table>

---

如图所示，您可以使用

：empty

psuedo选择器查找没有内容的元素：

$("#row1 td:empty").css("background-color", "black");

请注意，我修改了fiddle以处理表中的所有行，这样您就可以看到所有状态

---

要实现更新中所需的功能，可以在

表

元素上设置默认背景色，然后将

td

和

th

设置为正常背景色。不过，您需要删除边框，否则表格背景会显示出来。这可以通过使用一些填充物来增加单元之间的排水沟来解决。大概是这样的：

表格{
背景色：黑色；
边界塌陷：塌陷；
}
表th，
表td{
背景色：白色；
填充：2px；
}

---

简单只需将最后一行移到第一行

 $("#row1 td:contains('')").css("background-color", "Black");
    $("#row1 td:contains('itemA')").css("background-color", "lightBlue");
    $("#row1 td:contains('itemAB')").css("background-color", "yellow");
    $("#row1 td:contains('itemABC')").css("background-color", "lightGreen");

注意：包含（“”）是所有节点的累加，您必须使用@Rory McCrossan Post，这很好

您可以尝试以下方法：

：empty伪选择器将从所选行中选择空td元素。你可以参考这个

---

希望足够清晰1首先在所有单元格上设置黑色背景，然后查找“特殊”单元格

$("#row1 td").css("background-color", "Black");        
$("#row1 td:contains('itemA')").css("background-color", "lightBlue");
$("#row1 td:contains('itemAB')").css("background-color", "yellow");
$("#row1 td:contains('itemABC')").css("background-color", "lightGreen");

你能试试这个吗

$("#row1 td:empty").css("background-color", "black");

---

请记住，

：contains

查找子字符串匹配，而不是整个内容的精确匹配。因此，所有内容都包含无法完成的

'

@jbutler483。你需要有一个细胞，这样你可以给它一些颜色。因此，要么更改列间距，使所有行的宽度相同，要么添加额外的td元素以填补空白。@Barmar，问题是，有没有办法获得精确匹配？@lsp我目前使用的是

，但它似乎有点像黑客tbh。特别是当一个表是矩形的时候，我在我的项目中尝试了这个方法，但问题是我的设计不好（我想），在表继续的地方，我没有在最后一次输入之后定义“td”（即最后一个“槽”可能是15:00-15:20，我可能不会在一天的剩余时间继续添加这些“td”。谢谢Rory。是否有办法将此效果添加到任何“未定义”单元格（即表格底部最后一个“部分”，未定义“td”），或整个“etc”列为黑色，因为它的单元格为undefined@jbutler483您能详细解释一下您在上述评论中的确切意思吗？以便我能帮助您？@jbutler483不幸的是，无法做到这一点，因为该空间中没有单元格。@lsp请参阅edit.Rory，我不认为像“使背景变黑”这样的事情除了第一行和第一列之外的默认值不会使其变为黑色，或者类似于容器div之类的东西？啊，我明白你的意思。我已经为你更新了我的答案。

$("#row1 td:empty").css("background-color", "Black")

$("#row1 td").css("background-color", "Black");        
$("#row1 td:contains('itemA')").css("background-color", "lightBlue");
$("#row1 td:contains('itemAB')").css("background-color", "yellow");
$("#row1 td:contains('itemABC')").css("background-color", "lightGreen");

$("#row1 td:empty").css("background-color", "black");