Использование Firebug для отображения иерархии DOM

Question

В настоящее время я использую FireBug для отладки моего JavaScript и HTML-кода.Мне было интересно, если кто-нибудь знает о функции, где я могу навести курсор мыши на мою сгенерированную веб-страницу, и она будет отображать иерархию DOM, где моя мышь в настоящее время находится.Так что, если я вложил плавающие элементы div.И при наведении мыши на один из элементов div, он покажет идентификатор этого элемента div, идентификатор его родителя, идентификатор родителя его родителя и т. Д.

Answer 1

Разве нажатие кнопки проверки (второй сверху слева на Firebug) не делает что-то подобное?

Answer 2

Я не уверен, что это то, что вы ищете.Когда вы щелкнете правой кнопкой мыши и будете использовать «Проверять элемент», вы увидите DOM и все остальное в Firefox.

Answer 3

Google Chrome, щелкните правой кнопкой мыши и выберите «проверить элемент». Вызывает дерево dom с выделенным элементом, на который нажали

Answer 4

Это расширение FireFox делает именно это

Расширение веб-разработчика

Вы можете установить его для выделения элементов при наведении на них курсора, и оно будет отображать их информацию, кака также их положение в дереве.

Answer 5

Щелкните правой кнопкой мыши, Inspect Element также работает в Firefox / Firebug

Вы также можете использовать F12, Ctrl + B в IE 9.