Inserir texto em div com JavaScript
23/04/2013
0
Estou aqui novamente com um probleminha. Tenho dois inputs HTML: txtTitulo e txtSubitulo. Tenho tambem um botão que ao clicar nele, vou pegar o texto dos dois inputs e jogar dentro de uma div que fica logo abaixo. Aí eu consegui, beleza.
Só que gostaria de aplicar uma formatação, tipo o título maior que o subtítulo.
Tentei usar um <h1>, mas ao invés de formatar como HTML, aparece o texto "<h1>". Lembrando que sou iniciante e estou estudando JavaScript, por isso essas dúvidas e exemplos tão bestas.
Meu código e o seguinte:
<!DOCTYPE html>
<html>
<head>
<title>teste</title>
<meta charset="UTF-8" />
<script type="text/javascript">
function gravar(){
var titulo = document.getElementById("txtTitulo").value;
var subtitulo = document.getElementById("txtSubtitulo").value;
var div = document.getElementById("divResultado");
div.innerText = "<h1>" + titulo +"</h1>"+ "\n" + subtitulo;
}
</script>
</head>
<body>
<div>
<label>Título:</label>
<input type="text" id="txtTitulo"/>
<label>Subtítulo:</label>
<input type="text" id="txtSubtitulo"/>
<button id="btnEnviar" onclick="gravar()" >Gravar</button>
</div>
<div id="divResultado">
</div>
</body>
</html>Desde já agradeço qualquer colaboração.
Carlos Andriê
Post mais votado
23/04/2013
Troque o innerText por innerHTML e veja se dá certo.
Joel Rodrigues
Mais Posts
23/04/2013
Carlos Andriê
Mas sem querer abusar, você sabe me dizer o motivo? Qual a diferença entre essas duas funções?
23/04/2013
Joel Rodrigues
- innerText considera tudo que é atribuído a ela como texto, independente de colocar tags, elas serão apresentadas como puro texto.
- innerHTML considera que o texto atribuído a ela é um conteúdo HTML, que deve ser renderizado com tal. Assim, pode-se inserir tags HTML que elas serão apresentadas da forma convencional.
23/04/2013
Carlos Andriê
Esta questão está resolvida e muito bem explicada.
23/04/2013
Joel Rodrigues
Então estou marcando este tópico como Concluído.
Abraço.
Clique aqui para fazer login e interagir na Comunidade :)
