3

divを実行しようとしましempty()たが、特定のセレクターを除外しました。

私がこれまでに試したこと：

$('.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>
4

4 に答える 4

7

このように行うことができます：

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

$(".modal").contents().filter(function(){
    return !$(this).is('.close');
}).remove();
于 2013-01-13T15:22:12.777 に答える
2

バグについてはよくわかりませんが、これを達成するために私が見ることができる最も簡単な方法は次のとおりです。

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

JSフィドルデモ。

少し良いアプローチ（複数の.close要素の誤った仮定に基づく）：

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

JSフィドルデモ。

each()jQueryとプレーン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フィドルデモ。

そして、アプローチのJSパフォーマンス比較。当然のことながら、プレーンJavaScriptを使用すると、読むのがかなり醜いと思いますが、かなりスピードアップします（実際にどれだけきれいになるかはわかりませんが）。

興味深いことに（とにかく、以前にリンクされたJS Perfを更新したので）、参照を格納する変数を使用してel.parentNodeも、無視できるほどの違いがあります。おそらく、要素/ノードへの参照を保存しているにもかかわらず、DOMはまだ必要であるためです。el.previousSiblingノードを見つけるためにアクセスしましたか？

于 2013-01-13T15:10:17.843 に答える
0

あなたはこれを試すことができます：http：//fiddle.jshell.net/KLh4E/3/

var div = $('.modal').clone().find('a');
$('.modal').empty().html(div);
于 2013-01-13T15:12:35.923 に答える
0

jQueryがテキストノードと一致しません。この例のテキストは、.modal内に含まれるノードとしては表示されません。そのため、「他のノードを除くすべてのノードを選択する」ことによって削除することはできません。単純なテキストをラップする<span> と、トリックが実行されます。

于 2013-01-13T15:13:18.650 に答える