Bom dia!
Escrevi o código abaixo enquanto estudava, no entanto surgiu uma dúvida, quando usar o innerHTML, como mostrado no curso e quando utilizar o innerText como esta no meu código?
Entendo que o innerHTML vai inserir as tags que eu solicitar, por outro lado, se eu utilizar a mesma lógica do LI e criar um P e transformar ambos com appendChild o resultado seria o mesmo.
É questão de qualidade de escrita/semantica?
const createTask = (event) => {
event.preventDefault()
const list = document.querySelector('[data-list]')
const input = document.querySelector('[data-form-input]')
const valor = input.value
const task = document.createElement('li')
task.classList.add('content')
const content = document.createElement('p')
content.classList.add('task')
content.innerText = valor
task.appendChild(content)
list.appendChild(task)
input.value = " "
}
const createNewTask = document.querySelector('[data-form-button]')
createNewTask.addEventListener('click', createTask)