【问题标题】:How to find the elements with same data-* attributes and remove the duplicate items?如何找到具有相同 data-* 属性的元素并删除重复项?
【发布时间】:2018-02-25 00:19:07
【问题描述】:

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

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

如何确定 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" 删除了元素,但是 data-link 的值是动态的..所以我怎样才能得到它..

如果第二个和第三个&lt;td&gt; 中有输入元素,我如何仅删除文本Username

Fiddle

【问题讨论】:

标签: javascript jquery html html-table


【解决方案1】:

你的第一个问题:

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/

【讨论】:

    猜你喜欢
    • 2021-07-26
    • 1970-01-01
    • 2020-04-04
    • 1970-01-01
    • 2015-03-24
    • 2020-01-01
    • 2013-07-03
    • 1970-01-01
    • 2020-07-15
    相关资源
    最近更新 更多