Question

单击“创建”我想要提供连续的类名称：例如，现在如果单击“创建”按钮，则应创建以下<div class="div_3">Div 3</div>：

<div id="container">
    <div class="div_1">Div 1</div>
    <div class="div_2">Div 2</div>
</div>
<input type="button" onclick="add()" value="Create"/>

这是JS

function add(){
    $("#container").append("<div>Div 3</div>")
}

https://jsfiddle.net/5gmr5j8z/

Answer 1

一种方法是计算现有元素（并添加1）：

$("#container").append("<div>Div " + ($("#container div").length+1) + "</div>");

简单JSFiddle： https://jsfiddle.net/TrueBlueAussie/5gmr5j8z/2/

你需要将同样的东西应用到课堂上，但这会变得有点凌乱，下面的版本很简洁。

使用jQuery连接事件也最好。内联事件处理程序不具备jQuery处理程序的功能（并且没有充分理由从事件处理程序单独注册事件）：

$('#add').click(function () {
    var count = $("#container div").length + 1;
    var $div = $("<div>", {
        class: "div_" + count,
        text: "Div " + count
    });
    $("#container").append($div);
});

JSFiddle： https://jsfiddle.net/TrueBlueAussie/5gmr5j8z/3/

通常有更简洁的方法来做这类事情，但你需要先解释总体目标

在创建div元素时给出有序的类名

1 个答案: