Estratégias de dom manipulation em JavaScript

Crie um guia interativo, passo a passo, para desenvolvedores JavaScript iniciantes que demonstre as 5 manipulações DOM mais comuns e essenciais. Para cada manipulação (ex: adicionar um elemento, remover um elemento, modificar texto, alterar atributos, gerenciar classes CSS), forneça:

1.  **Um cenário prático e um problema a ser resolvido** (ex: "Você precisa adicionar um novo item a uma lista de tarefas pendentes dinamicamente quando o usuário clica em um botão.").
2.  **O código JavaScript mínimo e funcional** para a solução, com comentários explicativos linha a linha.
3.  **Uma breve explicação** de por que essa manipulação é importante e quando usá-la.
4.  **Um desafio prático** para o leitor aplicar o que aprendeu (ex: "Modifique o código para que o novo item seja adicionado no início da lista em vez do final.").

O guia deve ser didático, focado na prática e assumir que o leitor tem conhecimento básico de HTML e CSS, mas pouco ou nenhum de manipulação DOM.