我显示了一个动态生成的导航结构。每个位置都有从该位置的商店生成的商店类型。
我需要删除每个位置的重复项，以便杂货可以出现在两个位置。我尝试了下面常见的 jquery 解决方案，该解决方案删除了重复项，但它导致每个 storetype 仅出现在一个位置。
var seen = {};
$("ul#storetypes").find("li").each(function(index, html_obj) {
txt = $(this).text().toLowerCase();
if (seen[txt]) {
$(this).remove();
} else {
seen[txt] = true;
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="menu">
<li>Location 1
<ul id="storetypes" class="sub-menu">
<li>groceries</li>
<li>cakes</li>
<li>motor spares</li>
<li>groceries</li>
</ul>
</li>
<li>Location 2
<ul class="sub-menu">
<li>groceries</li>
<li>motor spares</li>
<li>motor spares</li>
<li>groceries</li>
</ul>
</li>
</ul>
你可以这样做：
$("ul.sub-menu li").each(function(index, html_obj) { if ($(this).prevAll(":contains(" + $(this).text() + ")").length > 0) { $(this).remove(); } });这将查看每个
.sub-menu并查看是否存在具有相同文本的“li”，并删除重复的内容。演示