我正在搜索解决方案,以删除使用javascript数组过滤的<li>
个标记。
var mygroups = [“1”,“8”,“3”,“4”,“5”]
示例(输入):
<li><div>1 element. Bla bla bla</div></li>
<li><div>2 element. Bla bla bla. This is my <span>post</span> into new group</div></li>
<li><div>3 element. Bla bla bla. Another one</li>
<li><div><a href="/groups/viewgroup/1-first-group">First group</a></div></li>
<li><div>5 element. Bla bla bla. This is my <span>new post</span></div></li>
<li><div>6 element. <img alt="groups.wall" class="newsfeed-icon" src="/assets/favicon/default.png"></div></li>
<li>7 element.</li>
<li><div><a href="/groups/viewgroup/8-second-group">First group</a></div></li>
<li><div><a href="/groups/viewgroup/16-other-group">First group</a></div></li>
<li><div><a href="/groups/viewgroup/5-tttt-group">First group</a></div></li>
如何获取此输出(删除所有不包含mygroups的实例):
<li><div><a href="/groups/viewgroup/1-first-group">First group</a></div></li>
<li><div><a href="/groups/viewgroup/8-second-group">First group</a></div></li>
<li><div><a href="/groups/viewgroup/5-tttt-group">First group</a></div></li>
谢谢!
答案 0 :(得分:3)
你真的应该引入某种标志(例如一个类名或一些data-
属性)来标识您不必显示的<li>
个节点。这种详细检查需要扫描每个<li>
的整个HTML,这不是一个好习惯。但是,它看起来像这样:
$('li').each(function(_, node) {
if( !/group|groups/.test( node.innerHTML ) )
$(node).remove();
});
答案 1 :(得分:1)
编辑:已更新以符合您的新要求。
也更新了jsFiddle示例。
我使用的jQuery代码是:
$(function() {
var mygroups = ["1", "8", "3", "4", "5"];
$('li').each(function() {
var $li = $(this);
// if you only want li's with an <a> link to a group page which matches one
// in your mygroups list...
var $a = $li.find('a[href^="/groups/viewgroup/"]');
// if we find a matching <a> (whose href attribute starts with "/groups/viewgroup/")
if ($a.length) {
// extract this <a>'s group number using a regular expression
var groupNum = $a.attr('href').replace(/^\/groups\/viewgroup\/(\d+)-.+$/gi, '$1');
// remove the <li> if group number is not in our allowed array
if ($.inArray(groupNum, mygroups) == -1) $li.remove();
} else {
$li.remove(); // no <a> found, so remove this <li>
}
});
});
我试图对此进行评论以解释大多数行,如果有任何意义,请告诉我。您可以使用此ChopApp page点击行,并在StackOverflow中更轻松地添加注释/问题。如果你使用它,请在这里给我留言,我会在那里回答你的问题。