jquery - JQuery-中間の要素を削除した後にマージする

Question

私のHTMLが次のようになっているとしましょう

<p>a<span>b</span>c</p>

後

$("span").remove();

私のHTMLは次のようになります

<p>
"a"
"c"
</p>

これらの2つの部分をマージして、HTMLが次のようになるようにするにはどうすればよい<p>ac</p>ですか？

jsfiddle

Answer 1

$("span").remove();
$("p").html($("p").html());
​

結果：

<p>ac</p>

Answer 2

これが1つです。これは、2つの連続するノードを結合するテキストノードにのみ影響します。

$("span").click(function() {
    var parent = this.parentNode;
    $(this).remove();
    normalize(parent);
});
function normalize(element){
    var contents = $(element).contents();
    contents.each(function(i){console.log(this.nodeType);
        if (this.nodeType == 3 && i > 0){
            var prev = contents[i-1];
            if (prev.nodeType == 3){
                this.nodeValue += prev.nodeValue;
                prev.parentNode.removeChild(prev);
            }
        }
    });
}

http://jsfiddle.net/mowglisanu/dgBwc/13/

Answer 3

var p  = $('p'),
    p2 = p.clone(true);
    p2.find('span').remove();
    p2.text(p2.text());
    p.parent().empty().append(p2);

フィドル

バインディングを維持します！

Answer 4

私はこれが古いことを知っています、しかしこれは何Node.normalizeのためにあるのですか：

$('p').get(0).normalize()

Node.normalize（）メソッドは、指定されたノードとそのすべてのサブツリーを「正規化された」形式にします。正規化されたサブツリーでは、サブツリー内のテキストノードは空でなく、隣接するテキストノードもありません。