Was ist der Unterschied zwischen den Funktionen replaceWith () und html () von jQuery, wenn HTML als Parameter übergeben wird?
Was ist der Unterschied zwischen den Funktionen replaceWith () und html () von jQuery, wenn HTML als Parameter übergeben wird?
Antworten:
Nehmen Sie diesen HTML-Code:
<div id="mydiv">Hello World</div>
Tun:
$('#mydiv').html('Aloha World');
Wird darin enden, dass:
<div id="mydiv">Aloha World</div>
Tun:
$('#mydiv').replaceWith('Aloha World');
Wird darin enden, dass:
Aloha World
So html () ersetzt den Inhalt des Elements, während replaceWith () ersetzt das eigentliche Element.
replaceWith () ersetzt das aktuelle Element, während html () einfach den Inhalt ersetzt.
Beachten Sie, dass replaceWith () das Element nicht tatsächlich löscht, sondern es einfach aus dem DOM entfernt und an Sie in der Auflistung zurückgibt.
Ein Beispiel für Peter: http://jsbin.com/ofirip/2
-1
und hoffe, dass dies für alle hilfreich ist. :)
var $form = $target.closest('tr').replaceWith(html)
Es stellt sich heraus, dass es $form
das Element vor dem Ersetzen enthält. Seufzer
Es gibt zwei Möglichkeiten, die Jquery-Funktionen html () und replaceWith () zu verwenden.
<div id="test_id">
<p>My Content</p>
</div>
1.) html () vs replaceWith ()
var html = $('#test_id p').html();
gibt "Mein Inhalt" zurück
Aber das
var replaceWith = $('#test_id p').replaceWith();
wird das gesamte DOM-Objekt von zurückgeben
<p>My Content</p>
.
2.) html ('value') vs replaceWith ('value')
$('#test_id p').html('<h1>H1 content</h1>');
wird Ihnen die folgende Ausgabe geben.
<div id="test_id">
<p><h1>H1 content</h1></p>
</div>
Aber das
$('#test_id p').replaceWith('<h1>H1 content</h1>');
wird dir folgendes geben.
<div id="test_id">
<h1>H1 content</h1>
</div>
Alte Frage, aber das kann jemandem helfen.
Es gibt einige Unterschiede in der Funktionsweise dieser Funktionen in Internet Explorer und Chrome / Firefox, wenn Ihr HTML nicht gültig ist.
Bereinigen Sie Ihren HTML-Code und sie funktionieren wie dokumentiert.
(Nicht zu schließen hat </center>
mich meinen Abend gekostet!)
Es kann auch nützlich sein zu wissen, dass .empty().append()
dies auch anstelle von verwendet werden kann.html()
. In der unten gezeigten Benchmark ist dies schneller, aber nur, wenn Sie diese Funktion mehrmals aufrufen müssen.