css 使用JavaScript内联隐藏特定表行[重复]

djp7away  于 2023-04-01  发布在  Java
关注(0)|答案(1)|浏览(113)

此问题在此处已有答案

How may I reference the script tag that loaded the currently-executing script?(14个答案)
2天前关闭。
这篇文章是昨天编辑并提交审查的。
我有下面的html,我不能修改。(它正在自动生成)

<table>
  <tbody>
    <tr>
      <th>UserName</th>
      <td>Bob</td>
    </tr>
    <tr>
      <th>Password</th>
      <td>Fred</td>
    </tr>
  </tbody>
</table>

这将显示:

UserName  Bob
Password  Fred

但是,我可以在td区域内插入代码。我想使用javascript或css隐藏父行。

示例

例如,如果我想隐藏第二行,我可以插入javascript:

<table>
  <tbody>
    <tr>
      <th>UserName</th>
      <td>Bob</td>
    </tr>
    <tr>
      <th>Password</th>
      <td>Fred <script type="text/javascript">document.parentrow.hide();</script> </td>
    </tr>
  </tbody>
</table>

然后它就应该显示

UserName  Bob

说明

  • 函数document.parentrow.hide();不工作,但它只是为了显示我正在寻找的一个例子。我想一个函数,隐藏与该td相关的当前行。
  • 我不能添加自定义类或id到tr标签,因为我没有控制的html的那部分。
  • 我确实看了一下提供的链接How may I reference the script tag,但它只是一个一般性的主题。它没有回答我关于表行的问题。它也不涉及访问行。该链接用于访问加载的javascript文件。
carvr3hs

carvr3hs1#

const secondRow = document.querySelector('tr:nth-child(2)')
secondRow.hidden = true
<table>
  <tbody>
    <tr>
      <th>UserName</th>
      <td>Bob</td>
    </tr>
    <tr>
      <th>Password</th>
      <td>Fred</td>
    </tr>
  </tbody>
</table>

相关问题