Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

vsantos

Enviar dados do objeto literal para HTML

Recommended Posts

Pessoal to com uma duvida referente a objetos.

vitor = {
	nome:"Vitor",
	idade: '21',
	email:"seuemail@email.com",
	endereco:"Rua x numero 20"
};

function listarContato(person){
//pego a classe para imprimir o conteudo do objeto//	
        var contentInfo = document.getElementsByClassName('right-content')[0];
//display block para exibir no html//    
	 contentInfo.style.display = "block";
 //aqui está o problema//    
	 for(key in person){

	 	contentInfo.innerHTML = person[key];
	 	console.log(person[key]);

	 }
	}

Quando uso console.log() ou document.write(), ele exibe todo o conteúdo do objeto. Mas se eu atribuir person[key] ao innerHTML ele só mostra o último elemento do objeto no meu html.

for(key in person){
	 	contentInfo.innerHTML = person[key];
	 	console.log(person[key]);
	 }

Compartilhar este post


Link para o post
Compartilhar em outros sites

isso acontece por que o innerHTML apaga todo o conteúdo e insere o novo, sugiro ir concatenando tudo em uma variável e depois fora do loop atribui com o innerhtml uma vez.,

mais ou menos assim:

var pessoa = "";

for(key in person){
  pessoa += person[key];
  console.log(person[key]);
}

contentInfo.innerHTML = pessoa;

Compartilhar este post


Link para o post
Compartilhar em outros sites

Funcionou perfeitamente, eu estava colocando o '+= direto no contentInfo.innerHTML'

isso estava duplicando o texto várias vezes quando eu chamava a função.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.