Wyjście JavaScript

JavaScript nie dostarcza żadnych wbudowanych funkcji drukowania lub wyświetlania.

Plan wyświetlania JavaScript

JavaScript może "wyświetlać" dane na różne sposoby:

  • używając window.alert() zapisz do okna ostrzeżenia
  • używając document.write(); zapisz do wyjścia HTML
  • używając innerHTML zapisz do elementu HTML
  • używając console.log(); zapisz do konsoli przeglądarki

używając innerHTML

Aby uzyskać dostęp do elementu HTML, JavaScript może użyć document.getElementById(id) metoda.

id Atrybut definiuje element HTML. Atrybut innerHTML definiuje zawartość HTML:

Przykład

<!DOCTYPE html>
<html>
<body>
<h1>Moja pierwsza strona</h1>
<p>Moje pierwsze akapit</p>
<p id="demo"></p>
<script>
 document.getElementById("demo").innerHTML = 5 + 6;
</script>
</body>
</html>

Spróbuj sam

Uwaga:Zmiana atrybutu innerHTML elementu HTML jest powszechnym sposobem wyświetlania danych w HTML.

Użyj document.write()

W celach testowych, użyj document.write(); jest bardziej wygodne:

Przykład

<!DOCTYPE html>
<html>
<body>
<h1>Moja pierwsza strona</h1>
<p>Moje pierwsze akapit</p>
<script>
document.write(5 + 6);
</script>
</body>
</html>

Spróbuj sam

Uwaga:po pełnym załadowaniu dokumentu HTML document.write(); UżyjUsuń wszystkie istniejące HTML :

Przykład

<!DOCTYPE html>
<html>
<body>
<h1>Moja pierwsza strona</h1>
<p>Moje pierwsze akapit</p>
<button onclick="document.write(5 + 6)">Spróbuj</button>
</body>
</html>

Spróbuj sam

Uwaga:document.write(); metoda jest przeznaczona wyłącznie do testów.

Użyj window.alert();

Możesz użyć okienka ostrzegawczego do wyświetlania danych:

Przykład

<!DOCTYPE html>
<html>
<body>
<h1>Moja pierwsza strona</h1>
<p>Moje pierwsze akapit</p>
<script>
window.alert(5 + 6);
</script>
</body>
</html>

Spróbuj sam

Użyj console.log();

W przeglądarce, możesz użyć console.log(); metody do wyświetlania danych.

Aktywuj konsolę przeglądarki za pomocą F12 i wybierz "Konsola" w menu.

Przykład

<!DOCTYPE html>
<html>
<body>
<h1>Moja pierwsza strona</h1>
<p>Moje pierwsze akapit</p>
<script>
console.log(5 + 6);
</script>
</body>
</html>

Spróbuj sam