Fundamentos de trabajo con DOM en JavaScript

En lecciones anteriores estudiamos las capacidades básicas del lenguaje JavaScript. A partir de esta lección nos ocuparemos de para lo que realmente JavaScript está destinado: cambiaremos elementos de la página HTML y reaccionaremos a las acciones del usuario. Nuestros scripts se volverán más espectaculares y útiles.

En todas las siguientes lecciones, tu código JavaScript debe estar ubicado debajo del código HTML al que accede. Es decir, la estructura de tu código debe verse de la siguiente manera:

<!DOCTYPE html>
<html>
	<head>
		
	</head>
	<body>
		tus etiquetas html
		
		<script>
			tu código JavaScript
		</script>
	</body>
</html>

O de la siguiente manera, si escribes el código JavaScript en un archivo separado:

<!DOCTYPE html>
<html>
	<head>
		
	</head>
	<body>
		tus etiquetas html
		
		<script src="index.js"></script>
	</body>
</html>

En el futuro, para ser breve, no daré el código completo, sino que simplemente indicaré qué necesita escribirse en la parte HTML, y qué - en la parte JavaScript.

Crea un archivo con la estructura de código indicada.