所以基本上我的 div 生成如下:
<div class="test className">content</div>
<div class="test className">content</div>
<div class="test className">content</div>
..
<div class="test className">content</div>
我正在尝试删除重复的 div 并只保留最后一个!有什么快速的想法吗?谢谢!
所以基本上我的 div 生成如下:
<div class="test className">content</div>
<div class="test className">content</div>
<div class="test className">content</div>
..
<div class="test className">content</div>
我正在尝试删除重复的 div 并只保留最后一个!有什么快速的想法吗?谢谢!
基于您提供的标记的快速想法。
var $div = $('div.test.className:contains(content)');
if ($div.length > 1) {
$div.not(':last').remove()
}
但我会首先防止重复。
编辑:这是另一种使用filter
andslice
方法:
$('.test.className').filter(function() {
return this.textContent === 'content';
}).slice(0, -1).remove();
在上面的代码片段中,-1
作为方法的第二个参数,.slice
集合中的最后一个元素被忽略。
像这样的东西:
$('.className').not(':last').remove();
用 选择所有 div .className
,从选择中删除最后一个,删除 div 集合,您将只保留最后一个。
演示:http: //jsfiddle.net/j5728/
原件(见下面的编辑)
正如Jan Dvorak所问的那样,我不确定您认为哪些属性可以确定一个元素是另一个元素的重复,但是,对于您的问题,以下不是特别快速但更通用的解决方案:
(function($) {
$.fn.removeDuplicates = function() {
var original = [];
this.each(function() {
var el = this, $el, isDuplicate;
$.each(original, function() {
$el = $(el);
// check whichever properties
// you believe determine whether
// it's a duplicate or not
if (el.tagName === this.tagName &&
el.className === this.className &&
el.id === this.id &&
el.value === this.value &&
el.href === this.href &&
$el.html() === $(this).html()) {
isDuplicate = true;
$el.remove();
}
});
if (!isDuplicate) {
original.push(el);
}
});
};
}(jQuery));
你会像这样使用它:
$('.test').removeDuplicates();
// .. or even
$('div').removeDuplicates();
// .. or even
$('.test.className').removeDuplicates();
以上所有内容都应按预期工作,如此处所示。
编辑
自从我写这篇文章以来已经有几年了,我已经了解了Node.isEqualNode。它提供了一种更简洁的方式来执行此操作,因此更新后的插件将如下所示(并将返回原始元素以进行链接):
(function($) {
'use strict';
$.fn.removeDuplicates = function() {
var $original = $([]);
this.each(function(i, el) {
var $el = $(el),
isDuplicate;
$original.each(function(i, orig) {
if (el.isEqualNode(orig)) {
isDuplicate = true;
$el.remove();
}
});
if (!isDuplicate) {
$original = $original.add($el);
}
});
return $original;
};
}(jQuery));
这里演示了一个工作示例。