複数のリストで属性を比較して重複を削除する

Question

各リスト項目内のhref属性に基づいてリスト項目をフィルタリングできるjQueryスクリプトを作成しようとしています。したがってlistOneのhrefがhrefと等しい場合、listTwoにlistTwoliというクラスを追加してリストから削除したいと考えています。

<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"); 
} 

上記のスクリプトの結果は「隠された」クラスはlistTwo内のすべてのliに追加されていることです。 のようには見えません。重複した階層を選択してください。

スクリプトではliに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>