jquery:通过指定数据属性删除元素

jquery: delete element by specifying data attribute

本文关键字:数据属性 删除 元素 jquery      更新时间:2023-09-26

好的。所以我陷入了一个简单的境地。我想删除某些<ul>内部的<li>元素,但从其data-*属性中删除。

我试过这个代码,但不知道为什么不起作用。看看我的jsbin。

请说明我哪里出了问题(因为我需要从中吸取教训(。

我知道这对你们来说很容易。。。但我搞不清楚。。。所以需要你的帮助。谢谢

我的代码:

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
  <meta charset="utf-8">
  <title>Example</title>
  <script>
  function deleteElement(id)
  {
    $("ul li").data("id", id).remove();
  }
  </script>
</head>
<body>
<ul>
  <li data-id="3">3<input type="button" onclick="deleteElement(3)" value="delete"></li>
  <li data-id="31">31<input type="button" onclick="deleteElement(31)" value="delete"></li>
  <li data-id="32">32<input type="button" onclick="deleteElement(32)" value="delete"></li>
  <li data-id="33">33<input type="button" onclick="deleteElement(33)" value="delete"></li>
  <li data-id="41">41<input type="button" onclick="deleteElement(41)" value="delete"></li>
  <li data-id="42">42<input type="button" onclick="deleteElement(42)" value="delete"></li>
  <li data-id="43">43<input type="button" onclick="deleteElement(43)" value="delete"></li>
</ul>
</body>
</html>

您可以通过属性进行选择:

$("ul li[data-id=" + id + "]").remove();

您可以使用属性选择器:

$('ul li[data-id="' + id + '"]').remove();

或者过滤器,如果你不想将变量连接到选择器中:

$('ul li').filter(function(){
    return $(this).data('id') == id;
}).remove();