JavaScript Вывод
Возможности вывода JavaScript
JavaScript может "отображать" данные по-разному:
- Запись в элемент HTML с использованием
innerHTML
. - Запись в вывод HTML с использованием
document.write()
. - Запись в окно предупреждения с использованием
window.alert()
. - Запись в консоль браузера с использованием
console.log()
.
Использование innerHTML
Чтобы получить доступ к элементу HTML, JavaScript может использовать этот document.getElementById(id)
метод.
Атрибут id
определяет HTML элемент.
Свойство innerHTML
определяет содержание HTML:
Пример
<!DOCTYPE html>
<html>
<body>
<h1>Моя первая веб страница</h1>
<p>Мой первый параграф</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>
</body>
</html>
Попробуйте сами »
Изменение свойства innerHTML элемента HTML - распространенный способ отображения данных в HTML.
Использование document.write()
Для тестирования удобно использовать document.write()
:
Пример
<!DOCTYPE html>
<html>
<body>
<h1>Моя первая веб страница</h1>
<p>Мой первый параграф.</p>
<script>
document.write(5 + 6);
</script>
</body>
</html>
Попробуйте сами »
Использование document.write() после загрузки HTML документа удалит весь существующий HTML:
Пример
<!DOCTYPE html>
<html>
<body>
<h1>Моя первая веб страница</h1>
<p>Мой первый параграф</p>
<button type="button" onclick="document.write(5 + 6)">Попробовать</button>
</body>
</html>
Попробуйте сами »
Метод document.write() следует использовать только для тестирования.
Использование window.alert()
Вы можете использовать окно предупреждения для отображения данных:
Пример
<!DOCTYPE html>
<html>
<body>
<h1>Моя первая веб страница</h1>
<p>Мой первый параграф</p>
<script>
window.alert(5 + 6);
</script>
</body>
</html>
Попробуйте сами »
Вы можете пропустить window
ключевое слово.
В JavaScript объект окна является объектом глобальной области видимости,
что означает, что переменные, свойства и методы по умолчанию принадлежат объекту окна.
Это также означает, что указывать window
ключевое слово необязательно:
Пример
<!DOCTYPE html>
<html>
<body>
<h1>Моя первая веб страница</h1>
<p>Мой первый параграф</p>
<script>
alert(5 + 6);
</script>
</body>
</html>
Попробуйте сами »
Использование console.log()
В целях отладки вы можете вызвать console.log()
метод в браузере для отображения данных.
Вы узнаете больше об отладке в следующей главе.
Пример
<!DOCTYPE html>
<html>
<body>
<script>
console.log(5 + 6);
</script>
</body>
</html>
Попробуйте сами »
Печать на JavaScript
JavaScript не имеет объекта печати или методов печати.
Вы не можете получить доступ к устройствам вывода из JavaScript.
Единственное исключение - вы можете вызвать window.print()
метод в браузере, чтобы распечатать содержимое текущего окна.
Пример
<!DOCTYPE html>
<html>
<body>
<button onclick="window.print()">Распечатайте эту страницу</button>
</body>
</html>
Попробуйте сами »