Не работает to do list на javascript

Question

Нажимаю на кнопку и вообще ничего не происходит. Ума не приложу почему.

var input = document.getElementById('input');
var button = document.getElementById('add');
var tasks = document.getElementById('tasks');

function createElement(task) {
  var item = document.createElement('li');
  var checkbox = document.createElement('input');
  checkbox.type = 'checkbox';
  checkbox.className = 'check';
  var label = document.createElement('label');
  label.innerText = task;
  var input1 = document.createElement('input');
  input1.type = 'text';
  var edit = document.createElement('button');
  edit.className = 'edit';
  var delet = document.createElement('button');
  delet.className = 'delet';

  item.appendChild(checkbox);
  item.appendChild(label);
  item.appendChild(input1);
  item.appendChild(edit);
  item.appendChild(delet);

  return item;
}

function addTask() {
  if (input.value) {
    var item = createElement(input.value);
    tasks.appendChild(item);
    input.value = '';
  }
}

button.onclick = addTask();

<!DOCTYPE html>
<html>

<head>
  <script src="js.js"></script>
  <title>Todo list</title>
</head>

<body>
  <div class="container">
    <h3>Добавить дело</h3>
    <input type="text" id="input">
    <button id="add">ADD</button>
    <hr>
    <h3>Список дел</h3>
    <ul id="tasks">
    </ul>
  </div>
</body>

</html>

Answer 1

var input = document.getElementById('input');
var button = document.getElementById('add');
var tasks = document.getElementById('tasks');

function createElement(task) {
  var item = document.createElement('li');
  var checkbox = document.createElement('input');
  checkbox.type = 'checkbox';
  checkbox.className = 'check';
  var label = document.createElement('label');
  label.innerText = task;
  var input1 = document.createElement('input');
  input1.type = 'text';
  var edit = document.createElement('button');
  edit.className = 'edit';
  var delet = document.createElement('button');
  delet.className = 'delet';

  item.appendChild(checkbox);
  item.appendChild(label);
  item.appendChild(input1);
  item.appendChild(edit);
  item.appendChild(delet);

  return item;
}

function addTask() {
  if (input.value) {
    var item = createElement(input.value);
    tasks.appendChild(item);
    input.value = '';
  }
}

button.onclick = addTask;

<!DOCTYPE html>
<html>

<head>
  <script src="js.js"></script>
  <title>Todo list</title>
</head>

<body>
  <div class="container">
    <h3>Добавить дело</h3>
    <input type="text" id="input">
    <button id="add">ADD</button>
    <hr>
    <h3>Список дел</h3>
    <ul id="tasks">
    </ul>
  </div>
</body>

</html>

БЛОГ НА HUSL

Не работает to do list на javascript

Ответы (1 шт):