Вывод JavaScript - печать в консоль - httpdoc.ru

Вывод JavaScript - печать в консоль

Вывод JavaScript - Javascript позволяет отображать данные различными способами, что позволяет пользователю отображать данные в привлекательном виде. В Javascript пользователь также может изменить что-то написанное или указанный стиль элемента даже после загрузки веб-страницы или после события. Кроме того, вы можете использовать всплывающие окна, такие как окна предупреждений, для отображения любой информации. JavaScript может "display" передавать данные по-разному:


Методы вывода JavaScript

Есть четыре разных способа отображения вывода в JavaScript.

  • Используя окно предупреждения, window.alert() .
  • Использование document.write() .
  • Изменяя внутренний HTML, используя innerHTML .
  • С помощью консоли браузера console.log() .

Использование window.alert ()

Этот метод отобразит окно предупреждения с некоторым текстом внутри и OK кнопкой, расположенной под текстом. Поле оповещения используется для предоставления пользователю любой важной информации. Он вызывается после указанного события, и веб-страница становится неработоспособной до тех пор, пока на ней не появится окно предупреждения.

Пример
<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title> JavaScript Window.alert() output method </title> 
</head> 

<body>
<h2>Display data using Alert Box</h2>
<script>
window.alert(8 + 4);
</script>
</body>
</html>

Вывод JavaScript с использованием document.write ()

Этот метод используется в целях тестирования, он показывает вывод в теле документа. Обычно он отображает содержимое в пределах основной части страницы.

Примечание. Его следует использовать только для целей тестирования, потому что, хотя он работает нормально, но если он используется после полной загрузки документа (используется с кнопкой), он удалит все существующие элементы HTML с веб-страницы.
Пример
<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title> JavaScript document.write() output method </title> 
</head> 

<body>
 <h2> Display Using document.write() Method </h2>
  <script>
   document.write(8 + 4);
  </script>
</body>
</html>

Выход

JavaScript document.write() output method Examples 12

Вывод JavaScript с использованием innerHTML

JavaScript может получить доступ к любому элементу с определенным идентификатором с помощью document.getElementById(id) метода, а затем CSS / HTML выбранного элемента можно изменить, используя innerHTML свойство с ним. Это свойство помогает вносить изменения даже после полной загрузки веб-страницы.

В id атрибут Выбирает HTML-элемент с этим конкретным идентификатором и innerHTML свойством определяют содержимое HTML:

Пример
<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title> JavaScript innerHTML Output Method </title> 
</head> 
<body>

<h2> Display data innerHTML </h2>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>

</body>
</html>

Выход

JavaScript innerHTML Output Method

11


Вывод JavaScript - печать в console.log ()

Он покажет вывод в разделе консоли браузера. В разделе консоли содержится информация о различных ошибках и предупреждениях, связанных с веб-страницей. Вам просто нужно нажать клавишу F12, чтобы открыть меню отладчика, и выбрать 'console' просмотр вывода, отображаемого в консоли.

Пример
<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title> JavaScript Console.log() Output Method </title> 
</head> 

<body>
<h2> Activate debugging with F12 </h2>
<p>Select "Console" in the debugger menu. Then click Run again.>/p>
 <script>
  console.log(8 + 4);
 </script>
</body>
</html>

Выход

JavaScript Console.log() Output Method

Активируйте отладку с помощью F12

Выберите «Консоль» в меню отладчика. Затем снова нажмите «Выполнить».