html - 使用css隐藏表格行tr包含特定标签

Question

您好，请帮帮我这里是一张桌子

<table class="variations" cellspacing="0">
  <tbody>
    <tr>
      <td class="label"><label for="pa_1ef722433d607dd9d2b8b7"><span>Ships From</span></label></td>
    </tr>
    <tr>
      <td class="label"><label for="pa_color"><span>color</span></label></td>
    </tr>
  </tbody>
</table>

我想隐藏每个带有标签的表格行 tr ="pa_1ef722433d607dd9d2b8b7"

Answer 1

您可以使用 js 执行此操作。您可以使用document.querySelectorAll()tr 访问表内的所有内容。然后你可以检查label for="pa_1ef722433d607dd9d2b8b7"每个内部的出现。让我向您展示自我解释的代码-

window.onload=()=>{
var elem=document.querySelectorAll("tr");
var i;
for(i=0;i<elem.length;i++){
  var obj=elem[i];
  if(obj.innerHTML.toString().includes('label for="pa_1ef722433d607dd9d2b8b7"')){
      obj.style.display="none";
    }
}
}

在 css 中访问父元素会比较困难，所以最好使用一些 javascript