Salida de JavaScript

JavaScript no proporciona ninguna función de impresión o visualización integrada.

Plan de visualización de JavaScript

JavaScript puede "mostrar" datos de diferentes maneras:

  • usar window.alert() escribir en un cuadro de alerta
  • usar document.write(); escribir en la salida HTML
  • usar innerHTML escribir en el elemento HTML
  • usar console.log(); escribir en la consola del navegador

usar innerHTML

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

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

Ejemplo

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

Prueba personal

Nota:Cambiar la propiedad innerHTML del elemento HTML es un método común para mostrar datos en HTML.

Use document.write()

Con fines de prueba, use document.write(); Muy conveniente:

Ejemplo

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

Prueba personal

Nota:Después de que el documento HTML se haya cargado completamente document.write(); UsarEliminar todos los HTML existentes :

Ejemplo

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

Prueba personal

Nota:document.write(); Métodos solo para pruebas.

Use window.alert()

Puede usar cuadros de alerta para mostrar datos:

Ejemplo

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

Prueba personal

Use console.log()

En el navegador, puede usar console.log(); Métodos para mostrar datos.

Active la consola del navegador presionando F12 y seleccione "Consola" en el menú.

Ejemplo

<!DOCTYPE html>
<html>
<body>
<h1>Mi primera página web</h1>
<p>Mi primer párrafo</p>
<script>
console.log(5 + 6);
</script>
</body>
</html>

Prueba personal