javascript - 如何从元素中删除一些 html 并将新的 html 附加到页面的另一个位置？

Question

我需要从元素中删除一些 html 并将该 html 插入页面上的新位置。

我的尝试（已注释掉）不起作用。

HTML：

<ul>
    <li>Hello</li>
    <li class="bye">Bye</li>    
</ul>

<div id="new-html"></div>

jQuery：

$('ul').find('.bye').remove().appendTo('new-html');

或者

$('ul').find('.bye').remove().clone().appendTo('new-html');

score 0 · Accepted Answer

你只是忘记了# in#new-html

$('ul').find('.bye').remove().appendTo('#new-html');

此外，附加元素会自动将其从原来的位置删除，因此无需删除它

$('ul').find('.bye').appendTo('#new-html');

score 0 · Accepted Answer

你可以这样做：

$('ul').find('.bye').appendTo('#new-html');

无需先删除元素。并#通过 id 在选择器中使用。

<li>另请注意，将元素附加到 a<div>将导致 HTML 无效。

演示

score 0 · Accepted Answer

您的代码几乎是正确的，但您想为 , 使用正确的 CSS 选择new-html器#new-html。但是，您还应该使用 jQuery 的detach()，因为它将保留与元素关联的任何数据。所以，使用这个：

$('ul').find('.bye').detach().appendTo('new-html');

3 回答 3