如果 child td 等于某些文本，则将 css 设置为 parent 节点

Question

我有例子

<tr>
    <td class="attr-sku">Test</td>
    <td class="attr attr-color">10 mm</td>
    <td class="attr attr-yd_length">5</td>
</tr>

我如何为 TR 节点设置边框，他们的 child td->class->attr-sku 中的文本是 'TEST'

它必须与 jQuery 一起或仅由 javascript 完成？

Answer 1

您可以使用过滤器找出包含特定文本的 td。然后对父节点应用css。

$("td.attr-sku").filter(function() {
    return $(this).text().trim() == "TEST"
}).closest("tr").css(" border-width", "5px");

或者您可以将特定的 class 添加到父 tr，这将是一种更简洁的方法。

$("td.attr-sku").filter(function() {
    return $(this).text().trim() == "TEST"
}).closest("tr").addClass("borderClass");

Answer 2

您可以这样使用jQuery：

$(".attr-sku").each(function () {
  if ($(this).text().trim() == "TEST")
    $(this).closest("tr").css("background-color", "red");
});

Set css to parent node if child td is equal to some text