Question

如何将div替换为持有者div的末尾？我在这里有这个：

<div id="container">
    <div id="content1">My text 1</div>
    <div id="content2">My text 2</div>
    <div id="content3">My text 3</div>
</div>

我想用JavaScript（或JQuery）将我的content1放到最后：

<div id="container">
    <div id="content2">My text 2</div>
    <div id="content3">My text 3</div>
    <div id="content1">My text 1</div>
</div>

Answer 1

这将在jQuery中执行：

$('#content1').insertAfter('#content3');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container">
    <div id="content1">My text 1</div>
    <div id="content2">My text 2</div>
    <div id="content3">My text 3</div>
</div>

Answer 2

append将始终将元素移动到父元素

中的最后一个位置

$('#container').append($('#content1'));

或者甚至只是将第一个元素移动到最后一个位置

$('#container').append(function() {
    return $(this).children().first();
});

Answer 3

＆＃13;

var container = $("#container");
$(":eq(0)", container).appendTo(container);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<div id="container">
    <div id="content1">My text 1</div>
    <div id="content2">My text 2</div>
    <div id="content3">My text 3</div>
</div>

＆＃13;

将div设置为容器div的末尾

3 个答案: