Про те, що таке інструменти розробника у браузері можна прочитати у нашій попередній статті «Інструменти розробника у браузері. Вкладка Console».
У цій статті ми розглянемо вкладку Elements, основним призначенням якої є перегляд коду сторінки у вигляді дерева елементів DOM. За допомогою цієї вкладки можна не тільки переглядати код, а й вносити в нього зміни, клікнувши правою кнопкою миші по потрібному елементу: додавати і редагувати атрибути, приховувати або видаляти елементи з дерева, додавати псевдокласи. Зміни, які відбулися на вкладці Elements, застосовуються тільки локально і скидаються після перезавантаження сторінки. Тому ця вкладка використовується для тестування зміни елементів сторінки, атрибутів, пошуку необхідного елемента в коді та перегляду його властивостей.
Щоб переглянути необхідний елемент в структурі, можна скористатися двома способами:
- Натиснути кнопку «Select an element in the page to inspect it».