jquery删除基于查询字符串的标记。

Question

我在div中的p标记中有一个图像列表。

如果jquery与这些a、semi、abandoned之一相等，如何使用jquery删除basket=标记？

​

<div id="userShop">
  <p class="shoppingbaskets">
    <a href="RunFunction.jsp;jsessionid=123456789?shop=querty&basket=empty"><img src="image/empty.png" title="empty" width="50" height="50"></a>
    <a href="RunFunction.jsp;jsessionid=123456789?shop=querty&basket=full"><img src="image/full.png" title="full" width="50" height="50"></a>
    <a href="RunFunction.jsp;jsessionid=123456789?shop=querty&basket=semi"><img src="image/semi.png" title="semi" width="50" height="50"></a>
    <a href="RunFunction.jsp;jsessionid=123456789?shop=querty&basket=abandoned"><img src="image/abandoned.png" title="abandoned" width="50" height="50"></a>
    <a href="RunFunction.jsp;jsessionid=123456789?shop=querty&basket=completed"><img src="image/completed.png" title="completed" width="50" height="50"></a>
  </p>
</div>

​

Answer 1

URL.searchParams在这里很有用

​

$("#userShop a").each(function(link) {
  if (["empty","semi","abandoned"].indexOf(
       new URL(this.href).searchParams.get("basket")
     ) !=-1) {
    $(this).remove();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="userShop">
  <p class="shoppingbaskets">
    <a href="RunFunction.jsp;jsessionid=123456789?shop=querty&basket=empty"><img src="image/empty.png" title="empty" width="50" height="50"></a>
    <a href="RunFunction.jsp;jsessionid=123456789?shop=querty&basket=full"><img src="image/full.png" title="full" width="50" height="50"></a>
    <a href="RunFunction.jsp;jsessionid=123456789?shop=querty&basket=semi"><img src="image/semi.png" title="semi" width="50" height="50"></a>
    <a href="RunFunction.jsp;jsessionid=123456789?shop=querty&basket=abandoned"><img src="image/abandoned.png" title="abandoned" width="50" height="50"></a>
    <a href="RunFunction.jsp;jsessionid=123456789?shop=querty&basket=completed"><img src="image/completed.png" title="completed" width="50" height="50"></a>
  </p>
</div>

​

Answer 2

href是一个属性，所以您可以通过属性选择器使用它，如果它以参数结尾，则可以使用$进行匹配。

​

var params = ["empty","semi","abandoned"];
for(var i in params){
 $("a[href$='basket=" + params[i] + "']").remove();
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="userShop">
  <p class="shoppingbaskets">
    <a href="RunFunction.jsp;jsessionid=123456789?shop=querty&basket=empty"><img src="image/empty.png" title="empty" width="50" height="50"></a>
    <a href="RunFunction.jsp;jsessionid=123456789?shop=querty&basket=full"><img src="image/full.png" title="full" width="50" height="50"></a>
    <a href="RunFunction.jsp;jsessionid=123456789?shop=querty&basket=semi"><img src="image/semi.png" title="semi" width="50" height="50"></a>
    <a href="RunFunction.jsp;jsessionid=123456789?shop=querty&basket=abandoned"><img src="image/abandoned.png" title="abandoned" width="50" height="50"></a>
    <a href="RunFunction.jsp;jsessionid=123456789?shop=querty&basket=completed"><img src="image/completed.png" title="completed" width="50" height="50"></a>
  </p>
</div>

​

Answer 3

隐藏具有属性中包含的值的元素

$("a[href*='basket=empty']").hide();
$("a[href*='basket=semi']").hide();
$("a[href*='basket=abandoned']").hide();

删除具有属性中包含的值的元素

$("a[href*='basket=empty']").remove();
$("a[href*='basket=semi']").remove();
$("a[href*='basket=abandoned']").remove();