Question

我们说我有<div>包含一些随机元素，但我使用这个独特的选择器创建了一个元素：$('.myUniqueElement')。我想使用.insertAfter()在我<div>的最后一个子位置移动此元素是否可能？解决方案是什么？

这是我的解决方案：http://jsfiddle.net/silverlight/RmB5K/3/可以吗？

HTML：

<div class='p'>
    <div class='myUniqueElement'>unique</div>
    <div>item</div>
    <div>item</div>
    <div>item</div>
</div>
<input type='button' id='b' value='Do'/>

使用Javascript：

$('#b').on('click',function(){
    $('.myUniqueElement').insertAfter($('.p :last-child'))
});

CSS：

.myUniqueElement{color:red;}

Answer 1

尝试

var mydiv = $('my-div-selector');
mydiv.find('.myUniqueElement').appendTo(mydiv)

或简单

$('my-div').append($('.myUniqueElement'))

Answer 2

无需使用.insertAfter。您还应该不使用.clone，因为它会删除所有附加的数据或事件，除非您使用.clone(true)。

只需使用.appendTo将目标元素添加到div，它就会从原始位置分离并添加为div的最后一个子元素：

$('.myUniqueElement').appendTo('#my-div');

Answer 3

这是我的解决方案，我认为这是我可以使用.insertAfter()的最佳方式：

HTML：

<div class='p'>
    <div class='myUniqueElement'>unique</div>
    <div>item</div>
    <div>item</div>
    <div>item</div>
</div>
<input type='button' id='b' value='Do'/>

jquery的：

$('#b').on('click',function(){
    $('.myUniqueElement').insertAfter($('.p :last-child'))
});

重点是:last-child 这是小提琴： http://jsfiddle.net/silverlight/RmB5K/3/

Answer 4

不需要多次调用$，只需将元素移到其父元素的末尾即可。

var myEl = $('.my-el-selector');
myEl.appendTo(myEl.parent());

Answer 5

要使用insertAfter()，您必须知道要将元素移动到的元素。正如你所说，你有随机元素，当然你不知道当前的最后一个元素，所以你可以做什么。

克隆要移动的元素并将其附加到父元素。

jQuery代码如下所示：

$clone_elem = $('.myUniqueElement').clone();
$('.myUniqueElement').remove();
$('div').append($clone_elem);

结帐fiddle

Answer 6

Vikas是对的。然而，可能这个是它的改进版本，因为原始元素被删除，而不是它的克隆....

    $elem = $('.myUniqueElement')
    $('div').append($elem.clone());
    $elem.remove();

jquery将元素移动到最后的子位置

6 个答案: