Конзола

Конзолата – твоят основен инструмент за изследване и дебъгване

Console в браузъра е най-важният инструмент за преглед и анализ на HTML, CSS и JavaScript. Чрез нея можеш да инспектираш елементи, да виждаш кои стилове реално се прилагат и кои са презаписани (override-нати), както и да извеждаш информация от кода без да прекъсваш зареждането на страницата. За разлика от alert, конзолата не блокира изпълнението и е стандартният начин за дебъгване.

Как да инспектираш елемент и да използваш Console

1. Отвори уеб страница в браузъра.
2. Кликни с десен бутон върху елемент и избери Inspect.
3. В таба Elements разгледай HTML дървото и избрания елемент.
4. В дясната част виж приложените CSS стилове – активни и зачеркнати (override-нати).
5. Добави в script таг ред с console.log("Текст").
6. Презареди страницата и отвори таба Console, за да видиш изхода.

Основни инструменти и команди

• Inspect – отваря инструментите за разработчици и маркира избрания елемент.
• Elements – показва HTML структурата и активните CSS стилове.
• Console – извежда съобщения и резултати от JavaScript код.
• console.log() – отпечатва текст или стойности в конзолата.
• Иконата за избор на елемент – позволява да посочиш директно елемент от страницата и да го намериш в HTML дървото.

Инструкция за гледане на уроците:

1. Изгледайте видеоурока.
2. Повторете показаното в урока.
3. Решете тестовете към урока (това отключва следващия урок).
4. Задайте въпрос, ако имате такъв.
5. Преминете към следващият урок.