Javascript为每个新元素添加新的订单id

Javascript add new order id to each new element

本文关键字：添加 id 元素 新元素 Javascript      更新时间：2023-09-26

对不起我的英语我现在真的不知道该怎么纠正问这个问题！！

我有任务列表，当我添加新任务时，我会为每个新任务添加类似序号的smomthing

示例任务1已存储到var whit id 1，任务2 var id 2。。。。。我想我需要使用迭代，但如何。。。？项目链接

var toDoList = function() {
  var addNewTask = function() {
      var input = document.getElementById("taks-input").value,
        itemTexts = input,
        colA = document.getElementById('task-col-a').children.length,
        colB = document.getElementById('task-col-b').children.length,
        taskBoks = document.createElement("div");
      taskBoks.className = "min-box";
      taskBoks.innerHTML = '<div class="col-3 chack" id=""><i class="fa fa-star"></i></div><div class="col-8 task-text" id="taskContent"><p>' + itemTexts + '</p></div><div class="col-1 color"></div>'
      if (colB > colA) {
        var todolist = document.getElementById("task-col-a");
      } else {
        var todolist = document.getElementById("task-col-b");
      }
      todolist.appendChild(taskBoks);
    },
    addButton = function() {
      var btn2 = document.getElementById("add-task-box");
      btn2.onclick = addNewTask;
    }
  addButton()
};
toDoList();

只需使用id="task_' + (taskCount++) + '"

var toDoList = function() {
  var taskCount = 0
  var addNewTask = function() {
      var input = document.getElementById("taks-input").value,
        itemTexts = input,
        colA = document.getElementById('task-col-a').children.length,
        colB = document.getElementById('task-col-b').children.length,
        taskBoks = document.createElement("div");
      taskBoks.className = "min-box";
      taskBoks.innerHTML = '<div class="col-3 chack" id="task_'+(taskCount ++)+'"><i class="fa fa-star"></i></div><div class="col-8 task-text" id="taskContent"><p>' + itemTexts + '</p></div><div class="col-1 color"></div>'
      if (colB > colA) {
        var todolist = document.getElementById("task-col-a");
      } else {
        var todolist = document.getElementById("task-col-b");
      }
      todolist.appendChild(taskBoks);
    },
    addButton = function() {
      var btn2 = document.getElementById("add-task-box");
      btn2.onclick = addNewTask;
    }
  addButton()
};
toDoList();
相关文章：