Javascript 你能根据th关系设计td吗？

说我有一个像这样的

<th>
  <div class="text-left field-sorting " rel="local_inventory"> Local inventory </div>
</th>
<th>
  <div class="text-left field-sorting " rel="something else1"> Something Else1 </div>
</th>
<th>
  <div class="text-left field-sorting " rel="something else2"> Something Else2 </div>
</th>

本地库存
还有别的吗
还有别的吗

我想要关联的td

<td>4</td>
<td>0</td>
<td></td>

4
0

---

若要在不添加类的情况下使用某种样式，是否可以基于是否存在值（如果数字大于0且不为空）来设置此td的样式？我将使用jQuery应用CSS。否则，我会侵入PHP脚本，使这个数据网格自动化。我知道可以访问th，所以我想我的问题是如何使用th访问相关td，即使td除了在同一列中之外没有任何唯一性。

您可以使用

nth child

选择器以td为目标。这将为同一列中的

th

设置所有相应的

td

样式

否则，我认为您至少不能使用

CSS

基于

th

条件编写选择器

在这种情况下，使用jQUery或添加类应该更适合您的需要

tr td:nth-child(2) { // Targets the 2nd td inside each tr
    // Some style
}

---

我想您想在这里使用

.filter

方法

$('td').filter(function(){
  var text = $.trim($(this).text());
  return text.length && +text > 0;
}).addClass('greater-than-zero');

下面是一个快速的小演示：

---

我现在更明白这个问题了。这个怎么样

$('td, th').addClass(function(idx){
 return 'col-' + ( $(this).index() + 1 );
});

---

通过演示：

为了清楚起见，您正在尝试在给定的

th

的同一列中查找所有

td

元素？您是在尝试访问给定列中的所有

td

，还是仅尝试访问列中宽度为5%的

td

元素？只需添加一个类即可。使用jQuery更新样式所带来的性能损失是不值得的。假设它们都在同一个表中，您不需要这样做。设置标题单元格的宽度还应设置该单元格中所有其他单元格的宽度column@MichaelPeterson忘了宽度吧，它们都一样。给定列中的所有td，然后仅选择有数据的td。

rowspan

对此有影响。不过OP没有提到这一点，所以这可能很好，因为我所有的td字段都会被修改。我只想将td绑定到th。这对于那个任务来说太全球化了。我还并没有让它工作，但我有足够的时间看到它会按照我的要求工作。好东西！，非常感谢。