javascript - 比较多个列表中的属性并删除重复项

Question

我正在尝试创建一个 jQuery 脚本，该脚本可以根据 href 过滤掉列表项。每个列表项中的属性。所以，如果 href在listOne等于 href在listTwo ，我想添加一个类到 listTwo li将其从列表中删除。

<ul id="listOne">
    <li><a href="somelink"></a></li>
    <li><a href="somelink"></a></li>
</ul>
<ul id="listTwo">
    <li><a href="somelink"></a></li>
    <li><a href="somelink"></a></li>
</ul>

这是我到目前为止在脚本中的内容:

var listOneHref = $("#listOne li a").each(function(){$(this).attr("href")});

var listTwoHref = $("#listTwo li a").each(function(){$(this).attr("title")});

if (listTwoHref = listOneHref) {
    $("#listTwo ul li").addClass("hidden");
}   else {
    $("#listTwo ul li").removeClass("hidden");
}

上述脚本的结果是“隐藏”类被添加到每个 li在listTwo 。它似乎不仅仅仅选择重复的href。

我该如何编写它，以便脚本仅将“隐藏”类添加到 li s 具有重复的 href来自 listOne在他们里面？

Answer 1

.each() 不会返回您认为会返回的列表；使用其结果也不允许您单独处理可能的匹配。

尝试:

$("#listOne li a").each(function() {
  var href = this.href;

  $('#listTwo li a').each(function() {
    if (href == this.href)
      $(this).parent().addClass('hidden');
  });
});

.hidden {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="listOne">
  <li>
    <a href="somelink"></a>
  </li>
  <li>
    <a href="somelink"></a>
  </li>
</ul>
<ul id="listTwo">
  <li><a href="somelink">hidden</a></li>
  <li><a href="somelink2">seen</a></li>
</ul>