В этом руководстве вы узнаете, как открыть вкладку «Консоль» или панель инструментов веб-разработки для просмотра сообщений.
Инструменты веб-разработки позволяют тестировать и отлаживать код JavaScript. Инструменты веб-разработки часто называют devtools.
Современные веб-браузеры, такие как Google Chrome, Firefox, Edge, Safari и Opera, предоставляют средства разработки в качестве встроенных функций.
Как правило, инструменты разработки позволяют работать с различными веб-технологиями, такими как HTML, CSS, DOM и JavaScript.
В этом руководстве вы узнаете, как открыть вкладку «Консоль» в инструментах разработки для просмотра сообщений, выводимых JavaScript.
Google Chrome
Сначала откройте файл devtools.html.
Файл devtools.html
содержит следующий код JavaScript:
console.log('Hello, devtools!'); // the following code causes an error let greeting = msg;
Затем нажмите F12
в Windows или Cmd+Opt+J
, если вы используете Mac.
Инструменты разработчика по умолчанию откроют вкладку «Консоль». Это будет выглядеть так:
Первое сообщение: 'Hello, DevTools!'
является результатом следующей команды:
console.log('Hello, DevTools!');
Чтобы вывести значение переменной, используйте следующий метод console.log()
.
let message = 'Good Morning!'; console.log(message);
Второе сообщение, которое появляется на вкладке «Консоль», — это ошибка.
Uncaught ReferenceError: msg is not defined
Это связано с тем, что переменная msg
не была определена в коде, но была указана в назначении.
Теперь вы можете видеть как обычные сообщения, выдаваемые console.log()
, так и сообщения об ошибках. Этого достаточно для начала. Мы углубимся в инструменты разработчика на следующем уроке.
Firefox и Edge
Как правило, вы открываете вкладку «Консоль» инструментов разработчика в Firefox и Edge, используя F12
. У них похожие пользовательские интерфейсы.
Safari
Если вы используете браузер Safari на Mac, вам необходимо сначала включить меню разработчика:
Затем нажмите Cmd+Opt+C
, чтобы переключить окно консоли:
В этом руководстве вы узнали, как открыть вкладку «Консоль» в инструментах разработки для проверки сообщений, выдаваемых кодом JavaScript.