Question

我需要设置我通过Javascript创建的节点的属性。但是，它变得非常复杂，因为值在整个脚本中位于不同的函数中。

我有一个构造函数：

function Todo(id, task, who, dueDate) {
    this.id = id;
    this.task = task;
    this.who = who;
    this.dueDate = dueDate;
    this.done = false;
}

然后我创建了包含待办事项的span元素：

function createNewTodo(todoItem) {
    var li = document.createElement("li");
    li.setAttribute("id", todoItem.id);

    var spanTodo = document.createElement("span");
    spanTodo.innerHTML =
        todoItem.who + " needs to " + todoItem.task + " by " + todoItem.dueDate;
    li.appendChild(spanTodo);
return li;
}

然后我从页面上的表单中获取值，用于设置who和task。和日期一样，但这有点复杂，因为我最后在我的代码中获取该值以获得今天的日期和他们输入的日期之间的差异。

function getFormData() {
    var task = document.getElementById("task").value;
    if (checkInputText(task, "Please enter a task")) return;

    var who = document.getElementById("who").value;
    if (checkInputText(who, "Please enter a person to do the task")) return;

    var adate = document.getElementById("dueDate").value;
    var reString = new RegExp("[0-9]{4}\\-\[0-9]{2}\\-\[0-9]{2}");

    var date = compareDates(date);
    var id = (new Date()).getTime();
    var todoItem = new Todo(id, task, who, date);
    todos.push(todoItem);
    addTodoToPage(todoItem);
    saveTodoItem(todoItem);
}

所以，天是我想要的价值。我想将dueDate设置为相等的天数，以便我可以在createNewToDo函数的innerHTML中使用该值。

function compareDates(date) {
  var days = Math.floor(daysCal);
  console.log(date);
  todoItem.setAttribute("dueDate", days);
  if (cdate < date) {
  console.log("you have" + " " + days + " " + "more day(s)");
  }
  else if (cdate > date ) {
  console.log("you are" + " " + -days + " " + "day(s) overdue");  
  } 
}

有关修改的任何想法将dueDate设置为天数值吗？

Answer 1

您的todoItem是由Todo构造函数创建的JS对象，而不是像li或spanTodo这样的DOM节点。因此，它没有setAttribute方法，如果您想设置它的属性，只需分配给它（使用member operator）：

todoItem.dueDate = daysL

将自定义属性附加到动态创建的节点javascript

1 个答案: