jQuery空但排除某個元素

我嘗試empty() div但排除特定的選擇器。jQuery空但排除某個元素

什麼I've tried至今：

$('.modal').find('.close').nextAll().empty(); 
$('.modal').find(':not(.close)').empty(); 
$('.modal').not('.close').empty(); 
$('.modal:not(.close)').empty();

HTML：

<div class="modal"> 
    <a href="#" class="close">Close</a> 
    ...I've the need to be removed... 
</div>

來源

2013-01-13 yckart

向我們展示了HTML的一個例子吧。 – Zim84

已經完成了，看看[fiddle]（http://fiddle.jshell.net/KLh4E/1/）... – yckart

你的HTML應該在*問題本身*，否則當JS小提琴摔倒了（和它確實，半頻繁地）這個問題變得毫無用處，作爲具有相同或類似問題的其他人的資源。 –

可以做這樣的：

http://fiddle.jshell.net/KLh4E/11/

$(".modal").contents().filter(function(){ 
    return !$(this).is('.close'); 
}).remove();

來源

2013-01-13 15:22:12

是啊，那樣:) – yckart

@yckart我認爲這是更好http://stackoverflow.com/a/6112694/891823 –

@ErickAstoOblitas我真的不知道鏈接是如何相關的問題？ –

我不知道有關的錯誤，但我看得出來做到這一點最簡單的方法是：

var el = $('.close'); 
$('.modal').empty().append(el);

JS Fiddle demo。

稍微更好的方法（多的不正確的假設.close元素）：

$('.modal').each(
    function(){ 
    var that = $(this), 
     el = that.find('.close'); 
    that.empty().append(el) 
    });

JS Fiddle demo。

使用jQuery each()和一個純JavaScript函數的組合：

function fratricide(el) { 
    while (el.previousSibling) { 
    el.parentNode.removeChild(el.previousSibling); 
    } 
    while (el.nextSibling) { 
    el.parentNode.removeChild(el.nextSibling); 
    } 
} 

$('.close').each(

function() { 
    fratricide(this); 
});

JS Fiddle demo。

和JS Perf comparison of approaches。毫不奇怪，使用普通JavaScript會顯着加快速度，儘管我認爲它很難讀（雖然我不確定它可以實際變得多漂亮）。

有趣的是使用變量來存儲參考el.parentNode使微小差別，因爲儘管保存到元/節點的DOM的引用可能（對我來說，反正現在我已經更新了先前聯JS逆足）仍然需要訪問才能找到el.previousSibling節點？

來源

2013-01-13 15:10:17

恩，不是很優雅，呃？！ – yckart

不，這就是我現在正在探索的...... =）您的實際頁面是否有多個'.close'元素？（我假設它......） –

不！實際上它被稱爲'.modal-close';） – yckart

你可以試試這個：http://fiddle.jshell.net/KLh4E/3/

var div = $('.modal').clone().find('a'); 
$('.modal').empty().html(div);

來源

2013-01-13 15:12:35 Jai

mhh，不是很優雅，呃？！ – yckart

那麼你想如何呢？多一點在一個班輪裏。 – Jai

我認爲刪除並重新插入從來不是一個好主意;） – yckart

jQuery的不匹配textnodes。您示例中的文本不會被視爲包含在.modal中的節點;因此無法通過「選擇除某些其他節點之外的所有節點」來刪除它。用簡單的<span>will do the trick包裝文本。

來源

2013-01-13 15:13:18 ilias

好想法，謝謝！ – yckart

jQuery空但排除某個元素

回答

相關問題