Оглавление


Описание

DevTools - очень мощный инструмент для работы с HTML страницей, анализа запросов, отладки JavaScript.

Инструменты web-разработчика доступны только для Chrome движка.


Как открыть окно?

Отобразить окно можно кликнув по соответствующей кнопке справа от адресной строки браузера ProjectMaker


Для чего это используется?


Как пользоваться

Кнопка Inspect

Нажмите эту кнопку и наведите курсор мыши на любой элемент в окне браузере и этот элемент тут же будет подсвечен во вкладке Elements.

Вкладка Elements

В данной вкладке можно проанализировать и модифицировать DOM текущей вкладки - изменить HTML код элементов (удалить или добавить атрибуты), можно вырезать часть элементов.

Поиск по XPath

Данное окно можно использовать для тестирования XPath запросов: открываете вкладку Elements, нажимаете комбинацию клавиш Ctrl+F, внизу окна появится поле для ввода поисковой фразы (1) (можно вводить простой текст, XPath, CSS Selector'ы).
Найденные элементы сразу будут подсвечиваться (2).

Вкладка Console

Тут можно составить и отладить JavaScript код. Весь код выполняется в контексте текущей вкладки, т.е. тут доступны все модули, библиотеки, объекты, которые загружены на текущей странице.
Когда код будет готов его можно будет запустить с помощью экшена Код JavaScript

Вкладка Network

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


Полезные ссылки