Salida de JavaScript

Posibilidades de visualización de Javascript

JavaScript puede mostar datos en diferentes formas:

Escribiendo en un elemento HTML usando: innerHTML.
Escribiendo en la salida HTML usando: document.write().
Escribiendo en cuadro de alerta usando: window.alert().
Escribiendo en la consola del navegador usando: console.log().
Imprimir la ventana del Navegador Web usando window.print().

Uso de innerHTML

Para acceder a un elemento HTML, JavaScript puede usar el método document.getElementById(id).

El atributo id define el elemento HTML. La propiedad innerHTML define el contenido HTML:

<!doctype html>
<html>
<body>
  <h1>Mi primera página</h1>
  <p>Mi primer párrafo.</p>
  <p id="demo"></p>
  <script>
    document.getElementById("demo").innerHTML = 5 + 6;
  </script>
</body>
</html>

Nota: Cambiar el contenido con la propiedad innerHTML de un elemento HTML es una forma muy común de mostrar datos en el HTML.

Uso de document.write()

En el siguiente ejemplo se muestra contenido usando document.write():

<!doctype html>
<html>
<body>
  <h1>Mi primera página</h1>
  <p>Mi primer párrafo.</p>
  <script>
    document.write(5 + 6);
  </script>
</body>
</html>

Usar document.write() después de que un documento HTML es cargado, borrara todo el HTML existente:

<!doctype html>
<html>
<body>
  <h1>Mi primera página</h1>
  <p>Mi primer párrafo.</p>
  <button type="button" onclick="document.write(5+6)">Prueba</button>  
</body>
</html>

Importante: El método document.write() solo debe usarse para pruebas.

Uso de window.alert()

También se puede usar un cuadro de alerta para mostrar datos:

<!doctype html>
<html>
<body>
  <h1>Mi primera página</h1>
  <p>Mi primer párrafo.</p>
  <script>
    window.alert(5 + 6);
  </script>
</body>
</html>

Uso de console.log()

Para propósitos de testeo, se puede usa el método console.log() para mostrar datos.

Nota: Se tratara más a profundo este tema en artículos posteriores.

<!doctype html>
<html>
<body>
  <script>
    console.log(5 + 6);
  </script>
</body>
</html>

Uso de window.print()

JavaScript no tiene ningún objeto ni método de impresión. Por consiguiente, no se puede accesar a los dispositivos de salida desde JavaScript.

La única excepción es que se puede llamar al método window.print() en el Navegador Web para imprimir contenido de la ventana actual.

<!dobtype html>
<html>
  <body>
    <button onclick='wondow.print()'>Imprimir esta Página</button>
  </body>
</html>