이전에 개발한 TODO LIST 소스

gistfile1.js

const newTodoForm = document.getElementById('newTodoForm')
const newTodo = document.getElementById('newTodo')
const todoList = document.getElementById('todoList')
const todoListEls = todoList.getElementsByTagName('li')
let todoListState = []

// todoListState 초기화
for (let i = 0; i < todoListEls.length; i++) {
  todoListState.push(todoListEls[i].innerText)
}

// todoList에 할일(Todo)를 추가할 수 있다.
function addTodo (todoText) {
  todoListState.push(todoText)
  console.log(todoListState)
  const newTodoLi = document.createElement('li')
  newTodoLi.className = 'close'
  newTodoLi.innerText = todoText
  newTodoLi.addEventListener('click', e => {
    e.preventDefault()
    removeTodo(newTodoLi)
  })
  todoList.appendChild(newTodoLi)
}

// todoList의 할 일을 삭제할 수 있다.
function removeTodo (todoLi) {
  todoListState = todoListState.filter(function (value, index) {
    return value != todoLi.innerText
  })
  console.log(todoListState)
  todoLi.style.display = 'none'
}

newTodoForm.addEventListener('submit', e => {
  e.preventDefault()
  addTodo(newTodo.value)
})