Aunque parezca raro, desde código JavaScript podemos generar dinámicamente una página HTML. Esto nos dará un gran potencial a la hora de devolver respuestas al usuario. Típicamente le devolveremos un alert o crearemos un nuevo elemento dentro de la página con el resultado de la respuesta. Pero, por qué no, la respuesta puede ser una nueva página HTML, creada dinámicamente.
Para poder hacer esto lo primero que vamos a hacer es crear un formulario donde vamos a recoger información del usuario. Será esta información la que utilicemos para crear el documento. Vamos a pedirle un nombre y una edad…
Como podemos ver en el código JavaScript, estamos llamando a la función crearDocumento con los valores del formulario. El contenido de dicha función será el objetivo de este documento.
Para crear un documento lo primero que tenemos que hacer es abrirlo. Para ello invocaremos al método open del objeto document. Dicho método recibe como parámetros dos datos. El primero es el mime-type del documento y el segundo sirve para indicar si queremos heredar la historia del documento desde el que se está generando.
Así, abriremos el documento de la siguiente forma:
var doc = document.open("text/html","replace");
Al abrir un documento HTML, el mime-type que utilizamos es «text/html».
Lo siguiente será crear el contenido del nuevo documento. Al ser un documento HTML, la estructura será la de cualquier documento HTML. Al menos.
Contenido
Así, en JavaScript lo definiremos de la siguiente forma. Sobre una simple variable:
var texto = "<html><body><h1>Saludo</h1>Hola " + nombre + ". Tu edad es de " + edad + " años.";
Con el documento abierto y el texto a volcar definido, lo siguiente será el escribir sobre el documento. Esto lo hacemos mediante el método .write(texto). Sobre el objeto document.
doc.write(texto);
Solo nos quedará la ultima cosa, pero no por ello menos importante, que será la de cerrar el documento.
doc.close();
