首页 > 解决方案 > JQuery 循环表并从 td 中删除一个 href

问题描述

我有一个表结构。

<table id="table">
    <tr>
        <td><a href="/one">One</a></td>
        <td><a href="/two">Two</a></td>
        <td><a href="/three">Three</a></td>
        <td><a href="/four">Four</a></td>
        <td><a href="/five">Five</a></td>
    </tr>
    <tr>
        <td><a href="/one">One</a></td>
        <td><a href="/two">Two</a></td>
        <td><a href="/three">Three</a></td>
        <td><a href="/four">Four</a></td>
        <td><a href="/five">Five</a></td>
    </tr>
    <tr>
        <td><a href="/one">One</a></td>
        <td><a href="/two">Two</a></td>
        <td><a href="/three">Three</a></td>
        <td><a href="/four">Four</a></td>
        <td><a href="/five">Five</a></td>
    </tr>
</table>

现在我想编写 JQuery 代码。

它将循环表格并a tag从 td 中删除除 2nd td 之外的 td。

标签: jquery

解决方案


您可以使用eachfor td 和find标签并使用removeAttr删除 href

$("#table tr").each(function(index, item){
  $(item).find('td').eq(0).find('a').removeAttr("href");
  $(item).find('td').eq(2).find('a').removeAttr("href");
  $(item).find('td').eq(3).find('a').removeAttr("href");
  $(item).find('td').eq(4).find('a').removeAttr("href");
});

$("#table tr").each(function(index, item){
  $(item).find('td').eq(0).find('a').removeAttr("href");
  $(item).find('td').eq(2).find('a').removeAttr("href");
  $(item).find('td').eq(3).find('a').removeAttr("href");
  $(item).find('td').eq(4).find('a').removeAttr("href");
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="table">
    <tr>
        <td><a href="/one">One</a></td>
        <td><a href="/two">Two</a></td>
        <td><a href="/three">Three</a></td>
        <td><a href="/four">Four</a></td>
        <td><a href="/five">Five</a></td>
    </tr>
    <tr>
        <td><a href="/one">One</a></td>
        <td><a href="/two">Two</a></td>
        <td><a href="/three">Three</a></td>
        <td><a href="/four">Four</a></td>
        <td><a href="/five">Five</a></td>
    </tr>
    <tr>
        <td><a href="/one">One</a></td>
        <td><a href="/two">Two</a></td>
        <td><a href="/three">Three</a></td>
        <td><a href="/four">Four</a></td>
        <td><a href="/five">Five</a></td>
    </tr>
</table>


推荐阅读