fandrefh · July 20, 2015 14:46
diff --git a/gistfile1.js b/gistfile1.js
 <!DOCTYPE html>
 <html lang="pt-br">
 <head>
 	<title>Site dinâmico com JavaScript</title>
 	<meta charset="utf-8">
 	<style type="text/css">
 		section article {
 			display: inline-block;
 			height: 100px;
 		}
 		header, nav, section, article, footer {
 			border: solid 1px gray;
 			margin: 4px;
 			padding: 4px;
 		}
 		ul {
 			list-style: none;
 		}
 		ul li {
 			display: inline;
 			border-right: 1px black solid; 
 		}
 		ul li a {
 			padding: 2px;
 			text-decoration: none;
 		}
 	</style>
 </head>
 <body>
 <header>
 	<h1>Site Dinâmico</h1>
 </header>
 <nav id="nav-menu">
 	<ul>
 		<li><a href="">Página 1</a></li>
 		<li><a href="">Página 2</a></li>
 	</ul>
 </nav>
 <section>
 	<h2>Criador de Elementos</h2>
 	<article>
 		<h3>Elementos</h3>
 		<button value="p" onclick="criaElemento(this.value)">Criar tag P</button>
 		<button value="button" onclick="criaElemento(this.value)">Criar tag BUTTON</button>
 		<button value="div" onclick="criaElemento(this.value)">Criar tag DIV</button>
 		<button value="input" onclick="criaElemento(this.value)">Criar tag INPUT</button>
 	</article>
 	<article>
 		<h3>Elementos</h3>
 		<p>Elemento: </p>
 		<select id="slc-dados-elementos"></select>
 	</article>
 </section>
 <section id="sec-elementos">
 	
 </section>
 <footer>
 	<p>Aula de JavaScript</p>
 </footer>
 <script type="text/javascript">

 	function criaElemento(tag) {
 		var elemento = document.createElement(tag);
 		elemento.innerText = "Também funciona!!!";
 		//elemento.onclick = obterAtributosDosElementos;
 		elemento.addEventListener("click", obterAtributosDosElementos);
 		document.getElementById('sec-elementos').appendChild(elemento);

 	}

 	function obterAtributosDosElementos() {
 		var select = document.getElementById("slc-dados-elementos");
 		console.log(select);
 		var chaves = Object.keys(this);
 		console.log(chaves);

 		for (var i = 0; i < chaves.length; i++) {
 			var opcao = document.createElement("option");
 			opcao.value = chaves[i];
 			opcao.innerText = chaves[i];
 			select.appendChild(opcao);
 		}
 	}
 	//var p = document.createElement("p");
 	//var texto = document.createTextNode("Texto");
 	//p.innerText = "Também funciona!!!";
 	//p.appendChild(texto);
 	//console.log(p);
 	//document.getElementById('sec-elementos').appendChild(p);
 </script>
 </body>
 </html>
	<!DOCTYPE html>
	<html lang="pt-br">
	<head>
	<title>Site dinâmico com JavaScript</title>
	<meta charset="utf-8">
	<style type="text/css">
	section article {
	display: inline-block;
	height: 100px;
	}
	header, nav, section, article, footer {
	border: solid 1px gray;
	margin: 4px;
	padding: 4px;
	}
	ul {
	list-style: none;
	}
	ul li {
	display: inline;
	border-right: 1px black solid;
	}
	ul li a {
	padding: 2px;
	text-decoration: none;
	}
	</style>
	</head>
	<body>
	<header>
	<h1>Site Dinâmico</h1>
	</header>
	<nav id="nav-menu">
	<ul>
	<li><a href="">Página 1</a></li>
	<li><a href="">Página 2</a></li>
	</ul>
	</nav>
	<section>
	<h2>Criador de Elementos</h2>
	<article>
	<h3>Elementos</h3>
	<button value="p" onclick="criaElemento(this.value)">Criar tag P</button>
	<button value="button" onclick="criaElemento(this.value)">Criar tag BUTTON</button>
	<button value="div" onclick="criaElemento(this.value)">Criar tag DIV</button>
	<button value="input" onclick="criaElemento(this.value)">Criar tag INPUT</button>
	</article>
	<article>
	<h3>Elementos</h3>
	<p>Elemento: </p>
	<select id="slc-dados-elementos"></select>
	</article>
	</section>
	<section id="sec-elementos">

	</section>
	<footer>
	<p>Aula de JavaScript</p>
	</footer>
	<script type="text/javascript">

	function criaElemento(tag) {
	var elemento = document.createElement(tag);
	elemento.innerText = "Também funciona!!!";
	//elemento.onclick = obterAtributosDosElementos;
	elemento.addEventListener("click", obterAtributosDosElementos);
	document.getElementById('sec-elementos').appendChild(elemento);

	}

	function obterAtributosDosElementos() {
	var select = document.getElementById("slc-dados-elementos");
	console.log(select);
	var chaves = Object.keys(this);
	console.log(chaves);

	for (var i = 0; i < chaves.length; i++) {
	var opcao = document.createElement("option");
	opcao.value = chaves[i];
	opcao.innerText = chaves[i];
	select.appendChild(opcao);
	}
	}
	//var p = document.createElement("p");
	//var texto = document.createTextNode("Texto");
	//p.innerText = "Também funciona!!!";
	//p.appendChild(texto);
	//console.log(p);
	//document.getElementById('sec-elementos').appendChild(p);
	</script>
	</body>
	</html>