Untitled

<!doctype html>
<html>
	<head>
		<meta http-equiv="content-type" content="text/html"/>
		<meta name="description" content="paginas de prueba"/>
		<meta name="keywords" content="web, html, informatica, ofertas informatica"/>
		<meta name="lang" content="es"/>
		<meta charset="UTF-8"/>
		<title>Ejemplo DOM</title><meta charset="utf-8">
		<style type="text/css">
			body {background-color:lightgray; font-family: sans-serif;}
			label {color: red; font-weight: bold; display:block; padding:5px;}
			#parrafo1 {font-weight: bold;}
			#parrafo2 {color: blue;}
		</style>
	</head>
	<body>
		<div id="cabecera" class="normal">
			<h1>- Ejemplo de DOM -</h1>
			<h2>Desarrollo web entorno cliente</h2>
		</div>
		<p id="parrafo">Aprendiendo DOM</p>
		<p class="normal">DOM es sencillo de aprender</p>
		<p>Ademas, DOM es muy potente</p>
		<!-- Formulario de contacto -->
		<form name ="formularioContacto" class="formularioTipo1" method="get" action="accion.html">
			<p>Si quieres contactar con nosotros envíanos este formulario relleno:</p>
			<label for="nombre"><span>Nombre:</span> <input id="nombre" type="text" name="nombre" /></label>
			<label for="apellidos"><span>Apellidos:</span> <input id="apellidos" type="text" name="apellidos"/></label>
			<label for="email"><span>Correo electrónico:</span> <input id="email" type="text" name="email"/></label>
			<label>
				<input type="button" value="Enviar"/>
				<input type="button" value="Cancelar"/>
				<button type="button" onclick="return nuevoemail()">Añadir Correo</button>
			</label>
		</form>
		<script>
			function nuevoemail(){
				var num = document.querySelectorAll(".emailincluido").length;
				if(num >= 5){
					alert("No se pueden añadir mas de 5 correos");
				}
				else{
					var label = document.getElementsByTagName("label");
					var emailincluido = document.createElement("label");
					emailincluido.setAttribute("class", "emailincluido");
					var inputincluido = document.createElement("input");
					var spanincluido = document.createElement("span");
					spanincluido.innerHTML = "correo"+num;
					var padre = label[2];
					var borraremail = document.createElement("button");
					borraremail.setAttribute("type", "button");
					borraremail.setAttribute("onclick", "borraremail()");
					borraremail.innerHTML = "Borrar correo";
					emailincluido.appendChild(spanincluido);
					emailincluido.appendChild(inputincluido);
					emailincluido.appendChild(borraremail);
					padre.appendChild(emailincluido);
					document.forms.item(0).appendChild(emailincluido);
				}
			}
			function borraremail(){
				document.forms.item(0).removeChild(document.getElementById("num"));
			}
		</script>
	</body>
</html>