如何查找具有相同 data-* 属性的元素并删除重复项

How to find the elements with same data-* attributes and remove the duplicate items?

本文关键字：元素 属性 删除 data- 何查找 查找      更新时间：2023-09-26

我有一个<table> <tr>元素的列表，它在<tr>和<td>元素中具有自定义数据属性。

此表有一些具有相同 data-* 属性的重复<tr>标签......我不想在页面中显示这些标签。

如何确定 data-* 属性并获取其值并查找该表中页面上的重复元素，并删除多余的 <tr> 标记。

这是我在生成页面后的HTML代码：

<table border="1">
    <tr class="clickable" data-hiddenfields="{&quot;hiddenFields&quot;:[]}" data-link="/site/product/1" data-index="0">
        <td data-fieldvalue="Username" data-fieldname="Name">
            <div data-fieldname="Username"></div>
            <span>
                <input type="checkbox" value="2" id="Username" name="checkbox" class="thumbnail">
            </span> Username
        </td>
        <td data-fieldvalue="Username"data-fieldname="FormLable">
            <div data-fieldname="Username"></div><span></span>Username
        </td>
        <td data-fieldvalue="Username" data-fieldname="FieldName">
            <div data-fieldname="Username"></div><span></span>Username
        </td>
        <td data-fieldvalue="2" data-fieldname="id">2</td>
    </tr>
    <tr class="clickable" data-hiddenfields="{&quot;hiddenFields&quot;:[]}" data-link="/site/product/1" data-index="1">
        <td data-fieldvalue="Username" data-fieldname="Name">
            <div data-fieldname="Username"></div>
            <span>
                <input type="checkbox" value="2" id="Username" name="checkbox" class="thumbnail">
            </span> Username
        </td>
        <td data-fieldvalue="Username" data-fieldname="FormLable">
            <div data-fieldname="Username"></div><span></span>Username
        </td>
<td data-fieldvalue="Username" data-fieldname="FieldName">
        <div data-fieldname="Username"></div><span></span>Username
    </td>
    <td data-fieldvalue="2" data-fieldname="id">2</td>
    </tr>
</table>

我已经用data-link="value"删除了元素，但数据链接的值是动态的。那我怎么能得到它..

以及我如何仅删除第二和第三<td>中的文本Username，如果它们内部有输入元素。

小提琴

你的第一个问题：

var searchText = $('tr').first().attr("data-link");
var el = $('tr[data-link="'+searchText+'"]');
console.log(el.length);
el[1].remove();

JSFIDDLE ：http://jsfiddle.net/FCbp8/3/

相关文章：