Output di JavaScript

JavaScript non fornisce alcuna funzione di stampa o visualizzazione integrata.

JavaScript può

  • usare window.alert() scrivere una finestra di avviso
  • usare document.write(); scrivere l'output HTML
  • usare innerHTML scrivere nell'elemento HTML
  • usare console.log(); scrivere nel console del browser

usare innerHTML

Per accedere agli elementi HTML, JavaScript può utilizzare document.getElementById(id) metodo.

id L'attributo definisce l'elemento HTML. L'attributo innerHTML definisce il contenuto HTML:

Esempio

<!DOCTYPE html>
<html>
<body>
<h1>La mia prima pagina web</h1>
<p>Il mio primo paragrafo</p>
<p id="demo"></p>
<script>
 document.getElementById("demo").innerHTML = 5 + 6;
</script>
</body>
</html> 

Prova tu stesso

Attenzione:Modificare l'attributo innerHTML dell'elemento HTML è un metodo comune per visualizzare dati in HTML.

Usa document.write()

Per scopi di test, usa document.write(); Più comodo:

Esempio

<!DOCTYPE html>
<html>
<body>
<h1>La mia prima pagina web</h1>
<p>Il mio primo paragrafo</p>
<script>
document.write(5 + 6);
</script>
</body>
</html> 

Prova tu stesso

Attenzione:Usa dopo che il documento HTML è completamente caricato document.write(); UsaElimina tutti gli HTML esistenti :

Esempio

<!DOCTYPE html>
<html>
<body>
<h1>La mia prima pagina web</h1>
<p>Il mio primo paragrafo</p>
<button onclick="document.write(5 + 6)">Prova</button>
</body>
</html>

Prova tu stesso

Attenzione:document.write(); Il metodo è utilizzato solo per test.

Usa window.alert()

Puoi usare i messaggi di avviso per visualizzare i dati:

Esempio

<!DOCTYPE html>
<html>
<body>
<h1>La mia prima pagina web</h1>
<p>Il mio primo paragrafo</p>
<script>
window.alert(5 + 6);
</script>
</body>
</html> 

Prova tu stesso

Usa console.log()

Nel browser, puoi usare console.log(); Metodi per visualizzare i dati.

Attiva la console del browser tramite F12 e seleziona "Console" nel menu.

Esempio

<!DOCTYPE html>
<html>
<body>
<h1>La mia prima pagina web</h1>
<p>Il mio primo paragrafo</p>
<script>
console.log(5 + 6);
</script>
</body>
</html>

Prova tu stesso