Javascript 如何添加新元素，并在单击某个按钮时进行一些更改，直到指定一个数字？

HTML代码：

<input type='text' id='element1' />
<button id='addNew'>Add New</button>

---

假设当前DOM中存在一些输入：

<ul class="jsEleList">
        <li><input type='text' id='element1' /></li>
    </ul>
    <button class="jsAddNewBtn">Add New</button>

• 函数

  count

  在每次调用中递增

  +1

• 函数

  count

  以现有输入

  $（'[type=“text”]'）开始。长度

var count=function（）{
return（count.i=（count.i | |$（'[type=“text”]'）.length）+1）；
}
$（'#addNew'）。单击（函数（）{
var i=计数（）；
如果（i>8）返回；
$（'body'）。追加（$（``））；
});


添加新的（'#addNew'）。单击（（函数（）{
var计数=0；
返回函数（）{
如果（计数<8）{
//创建新元素
}
计数++
}
})());

请参阅JavaScript闭包：
我不建议创建这样的id


var计数=1；
$（'#addNew'）。单击（函数（）{
如果（计数
$（'#addNew'）。单击（函数（）{
var last_element=$（document.find（'.element'）.last（）；
var new_element=last_element.clone（）；
var new_element_id='element'+（parseInt（last_element.attr（'id'）.replace（'element'，''）+1）；
新元素。
属性（'id'，新元素\u id）。
插入符（最后一个元素）；
//供展示之用
new_element.val（new_element_id）；
})；
.element{
显示：块；
}

添加新的
试试这个：

HTML:

<ul class="jsEleList">
        <li><input type='text' id='element1' /></li>
    </ul>
    <button class="jsAddNewBtn">Add New</button>




新增

JS：

$(document).ready(function(){
        var index = 2;
        $(".jsAddNewBtn").on('click', function(){
            if(index <= 8) {
                var data = $(".jsEleList li").first().find('input').clone();
                data.attr('id', 'element' + index);
                var li = $('<li>').append(data);
                $(".jsEleList").append(li);
            }
            index++;
        });
    });

$（文档）.ready（函数（）{
var指数=2；
$（.jsAddNewBtn”）。在（'click'，function（）上{
如果（索引是您所需要的，但是我建议不要创建具有增量
id
属性的元素。它很快会成为维护的一个难题，并使您的逻辑比其他情况下需要的复杂得多。在什么情况下，您需要使用其
id
标识元素？使用它可能更好。）类和/或DOM遍历，具体取决于具体情况
<ul class="jsEleList">
        <li><input type='text' id='element1' /></li>
    </ul>
    <button class="jsAddNewBtn">Add New</button>

$(document).ready(function(){
        var index = 2;
        $(".jsAddNewBtn").on('click', function(){
            if(index <= 8) {
                var data = $(".jsEleList li").first().find('input').clone();
                data.attr('id', 'element' + index);
                var li = $('<li>').append(data);
                $(".jsEleList").append(li);
            }
            index++;
        });
    });