如何使用CSS包含仅包含空格（）的元素？

Question

我有一个表，并且有一些列包含以下代码：

<td class="t-Report-cell" align="right" headers="KORTING_PERC">&nbsp;</td>

我希望能够定位具有headers =“KORTING_PERC”并且仅包含空格的html变体的TD。

我尝试过以下方法：

td[headers="KORTING_PERC"]:contains(" ")
td[headers="KORTING_PERC"]:contains(" ")
td[headers="KORTING_PERC"]:not(:empty)

使用以下红色背景：

[headers="KORTING_PERC"]:not(:contains(" ")){
  background: red;
}

结果是：

Answer 1

试试这个

$('td[headers="KORTING_PERC"]').each(function(){
   if($(this).text() == ' ' || $(this).text() == ''){
      $(this).css('background','red');
   }
});

Answer 2

div[headers='KORTING_PERC'][data-value='23'] {
   background-color: red;
}

     <div class="t-Report-cell" align="right" data-value="23" headers="KORTING_PERC">23</div>
     <div class="t-Report-cell" align="right" data-value="" headers="KORTING_PERC">23</div>

您不能使用CSS选择innerText，您可以使用jQuery通过文本进行选择，或者您可以在html标记中添加另一个属性，其中包含元素的值并在CSS中选择。