0

我有一个类似下面格式的代码。我不想显示内容两次。例如，文本“问题 1”在第一个 ul 标记中重复了 4 次。我希望它使用 javascript/jquery 显示一次。谢谢。

<h3>Year 2010</h3>
<ul>
  <li><a href="2010/1/2">Issue 2</a></li>
  <li><a href="2010/1/1">Issue 1</a></li>
  <li><a href="2010/1/2">Issue 2</a></li>
  <li><a href="2010/1/1">Issue 1</a></li>
  <li><a href="2010/1/1">Issue 1</a></li>
  <li><a href="2010/1/1">Issue 1</a></li>
</ul>

<h3>Year 2011</h3>
<ul>
  <li><a href="2010/1/2">Issue 2</a></li>
  <li><a href="2010/1/1">Issue 1</a></li>
  <li><a href="2010/1/2">Issue 2</a></li>
  <li><a href="2010/1/2">Issue 2</a></li>
</ul>
4

2 回答 2

1

尝试使用这个：

$('ul').each(function(){
    var issues = [];
    $(this).find('li a').each(function(){
        var text = $(this).text();
        if($.inArray(text, issues) > -1){
            $(this).parent().remove();
        }else{
            issues.push(text);
        }
    });
});

它遍历每个ul，然后遍历li a其中的每个。ul它将每个 元素的文本存储a在一个数组 ( issues) 中。

对于每一个li a它检查文本是否已经被添加到数组中（即它是重复的）。如果有，则删除 parent li，如果没有，则将其添加到数组中。

它在这里工作：http: //jsfiddle.net/3kr2m/1/

于 2013-06-25T23:19:40.563 回答
0

这是一个原生JavaScript解决方案，slice用于将NodeList转换为Array并forEach进行循环（forEach直接在NodeList上使用似乎有一些问题），然后是removeChild与我们之前看到的类似的 on 节点。

Array.prototype.slice.call(document.getElementsByTagName('ul')) // <ul>s to Array
    .forEach( // loop over them
        function (ul) {
            var text = {}; // record what we have seen
            Array.prototype.slice.call(ul.childNodes) // <li>s to Array
                .forEach(  // loop over these
                    function (li) {
                        if (li.nodeType !== 1 || li.tagName !== 'LI')
                            return; // only care about <li>s
                        if (text[li.textContent])
                            ul.removeChild(li); // seen it, remove
                        text[li.textContent] = 1; // mark seen
                    }
                );
        }
    );

演示小提琴

当然，您可以使用fororwhile循环，这会更快一些，但需要您跟踪更多变量。

var ul, li, i, j, text;
ul = document.getElementsByTagName('ul');
for (i = 0; i < ul.length; ++i) { // loop over <ul>
    text = {}; // reset seen for each <ul>
    li = ul[i].childNodes;
    for (j = 0; j < li.length; ++j) { // loop over <ul> children
        if (li[j].nodeType === 1 && li[j].tagName === 'LI') { // only <li>
            if (text[li[j].textContent]) ul[i].removeChild(li[j]); // remove seen
            text[li[j].textContent] = 1; // mark seen
        }
    }
}

这个演示

于 2013-06-25T23:36:38.537 回答