删除没有'我没有id或类

Remove td that doesn't have an id or class

本文关键字：id 或类 删除      更新时间：2024-02-29

我有一个简单的问题，但我一辈子都无法解决。。。

我想从tr（及其子级：类为"sch"的div和id为"hlp"的a）中删除整个td。但是，td本身没有id、类或任何其他定义特征。

tr的代码

<tr>
  <td nowrap="">
    <div class="sch">
      <a class="btn" href="?ae=Dialog&amp;t=AddressBook&amp;ctx=1" title="Address Book">
        <img src="http://placehold.it/35x35&text=1" alt="">Address Book</a>
    </div>
  </td>
  <td nowrap="">
    <div class="sch">
      <a class="btn" onclick="return onClkOp();" href="?ae=Options&amp;t=Messaging" title="Options">
        <img src="http://placehold.it/35x35&text=2" alt="">Options</a>
    </div>
  </td>
  <!-- ***** To be removed ***** -->
  <td nowrap="">
    <div class="sch">
      <a id="hlp" class="btn" href="#" title="Help">
        <img src="https://mail.kgs.org.uk/owa/8.3.298.1/themes/base/help.gif" alt="Help">
      </a>
    </div>
  </td>
  <!-- ********** -->
  <td nowrap="">
    <div class="sch">
      <a id="lo" class="btn" href="#" title="Log Off">
        <img class="noSrc" src="http://placehold.it/35x35&text=4" alt="">Log Off</a>
    </div>
  </td>
</tr>

我尝试过：
1.

$(document).ready(function() {
   $("td").has(".sch").remove(); //This removes the entire row, which I don't want
});

2.

$(document).ready(function() {
   $("td").has(".sch").has("#hlp").remove(); //This doesn't work
});

3.

$(document).ready(function() {
   $(".sch").prev("td").remove();
   $("#hlp").prev(".sch").remove();   //Doesn't work...
});

注意：我不能在我的代码中直接这样做，或者在有问题的td中添加id，以及为什么它是一个表，是因为我正在编辑我的网络邮件（OWA），并且不能物理更改代码：我正在使用浏览器扩展来添加Javascript和CSS，因此它必须是JS或jQuery（如果有办法的话，甚至是CSS）

您可以在has选择器中使用锚元素的id，只针对所需的td元素：

$('td:has(div.sch a#hlp)').remove();

工作演示

要删除的TD是第三个。因此，如果页面结构不变，可以使用:nth-child选择器。

$(tableSelector + ' td:nth-child(3)').remove();

（您不希望从页面中的所有表中剪切出第三列）。

或者，您可以反向工作，并以a#hlp为目标。然后使用.closest()查找封闭的td，并将其移除。

试试这个：

$(".sch").find('#hlp').closest('td').remove();

或者因为id是唯一的，所以你可以直接这样做：

$('#hlp').closest('td').remove();


$('.sch').find('#hlp').closest('td').remove();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
  <td nowrap="">
    <div class="sch">
      <a class="btn" href="?ae=Dialog&amp;t=AddressBook&amp;ctx=1" title="Address Book">
        <img src="http://placehold.it/35x35&text=1" alt="">Address Book</a>
    </div>
  </td>
  <td nowrap="">
    <div class="sch">
      <a class="btn" onclick="return onClkOp();" href="?ae=Options&amp;t=Messaging" title="Options">
        <img src="http://placehold.it/35x35&text=2" alt="">Options</a>
    </div>
  </td>
  <!-- ***** To be removed ***** -->
  <td nowrap="">
    <div class="sch">
      <a id="hlp" class="btn" href="#" title="Help">remove
        <img src="https://mail.kgs.org.uk/owa/8.3.298.1/themes/base/help.gif" alt="Help">
      </a>
    </div>
  </td>
  <!-- ********** -->
  <td nowrap="">
    <div class="sch">
      <a id="lo" class="btn" href="#" title="Log Off">
        <img class="noSrc" src="http://placehold.it/35x35&text=4" alt="">Log Off</a>
    </div>
  </td>
</tr>
</table>

相关文章：