Question

如果我有这样的div：

<div id="a">
    <div id="a1">...</div>
    <div id="a2">...</div>
    <div id="a3">...</div>
</div>

如何使用jQuery将另一个div添加到#a内的最后一个位置？

    <div id="a4">...</div>

这样就变成了这个：

<div id="a">
    <div id="a1">...</div>
    <div id="a2">...</div>
    <div id="a3">...</div>
    <div id="a4">...</div>
</div>

Answer 1

只需使用.append()将其贴在最后：

$("#a").append('<div id="a4">...</div>');

如果a4 已经，或者您正在创建它，那么您也可以反过来使用.appendTo()：

$("#a4").appendTo("#a");
//or if creating...
$('<div id="a4">...</div>').appendTo("#a");

Answer 2

试试这个

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="jquery-latest.js"></script>
<script type="text/javascript">

$( init );

function init() {
  var newPara = $( "<div id='a4'>...</div>" );
  $('#a').prepend( newPara );

}

</script>

</head>
<body>
  <div id="a">
    <div id="a1">...</div>
    <div id="a2">...</div>
    <div id="a3">...</div>
</div>

</body>
</html>

Answer 3

您可以使用jQuery的追加方法 - http://api.jquery.com/append/

$('#a').append('<div id="a4">...</div>');

Answer 4

这是另一种选择：

$("#a").append(function() {
    var nextId = $(this).children().length + 1;
    return $('<div/>')
        .attr('id','a' + nextId)
        .html('New id: a' + nextId);
});

这将检查你有多少div添加一个具有正确ID的新

示例：http://jsfiddle.net/jonathon/2h9aZ/

如何使用jQuery将元素添加到DIV中的最后一个位置？

4 个答案: