Por que no curso estamos utilizando "textContent" paga pegar, e setar os valores do elementos HTML e não ".value" ou ".innerHTML"?
Por que no curso estamos utilizando "textContent" paga pegar, e setar os valores do elementos HTML e não ".value" ou ".innerHTML"?
Ah ham! :)
O .textContent
serve para obtermos o valor de no TEXT_NODE
. Text_node são aqueles que possuem apenas texto. Por exemplo, usar textContent
em um h2
, span
ou div
retorna o conteúdo textual deles. Certo?
Daí, você você perguntou..wtf...e o .value
? Ai vem uma dica: quando você quer ler o valor de elementos que só exibem dados você usa textContent
, mas se for elementos que capturam dados você usa .value
. Por exemplo, um input você usa value.
E o innerHTML
. O innerHTML é um caso especial. Se você gravar a string <h1></h1>
na propriedade innerHTML
o JavaScript irá converter o texto para um elemento do DOM correspondente ao h1
. Ou seja, qualquer texto adicionadno no innerHTML não é simplesmente adicionado como texto, mas é convertido (parseado) para elementos do DOM. É uma forma fácil de adicionar novos elementos na página sem termos muito trabalho.
Ficou mais claro agora?
Poxa, muito obrigado pelo esclarecimento! Valeu!
Tranquilo Gus. É que JavaScript é uma linguagem poderosa, mas muito marota. Há várias formas de se fazer algo, e por mais que elas pareçam a mesma coisa, há diferenças. Então, resumindo:
1 - textContent: quando quer alterar o conteúdo de elementos HTML que só exibem informações para o usuário, como h1, span, div, p, a...
2 - value: quando for elemento que recebe entrada do usuário, como input, textarea...
3 - innerHTML: quando queremos adicionar novos elementos no página passando um texto com a marcação correta. Essa marcação é convertida para elementos do DOM automaticamente.
Valeu pela última resposta! Eu achava que era basicamente as mesmas coisas.