JQuery是否有一个“;移动“;作用或者有没有一种更紧凑的方法来做到这一点

Does JQuery have a "move" function? Or is there a more compact way of doing this?

本文关键字：方法 这一点 一种 作用 移动 有一个 是否 或者 有没有 JQuery      更新时间：2023-09-26

当将JQuery与内容管理系统结合使用时，我发现自己经常编写诸如之类的代码片段

$(document).ready(function()
{
    var thishtml = $('#some-element')[0].outerHTML;
    $('#some-element').remove();
    $('#hmpg-btm-box-holder').prepend(thishtml);
});

JQuery是否具有以更紧凑的方式实现这一点的功能？

这就足够了：

$(document).ready(function()
{
    $('#hmpg-btm-box-holder').prepend($('#some-element'));
});

我会尽可能避免使用outerHTML（最好也使用innerHTML，除非您通过AJAX从受信任的服务器接收到一些HTML并希望将其包含在文档中）。

将元素从Element转换为字符串（HTML）表示，然后再转换回Element，很容易产生不必要的效果，比如删除所有附加到它的事件处理程序

插入/移动单个DOM元素作为另一个元素的第一个子元素是一个简单的单行。

$('#hmpg-btm-box-holder').prepend($('#some-element'));

或者，如果您想附加为最后一个子项：

$('#hmpg-btm-box-holder').append($('#some-element'));

请注意，在这两种情况下，如果适用，参数中指定的DOM元素将从DOM中的现有位置中删除。

这只适用于解析为单个DOM元素的选择器。对于集合作为参数传递的情况，行为有点不同，因此请参考函数文档以更好地理解这一点。

您也可以使用.replaceWith()。

$('.original').replaceWith('.new');
相关文章：