Как просмотреть значение атрибутов данных в режиме реального времени в инструменте разработчиков Chrome?

Я хочу видеть значения, когда я исследую DOM в инструменте разработчиков. А также, если возможно, посмотрите, что привязано к элементу javascript. Возможно ли это с помощью какого-либо подключаемого модуля или как я могу это сделать?

Ответы

Ответ 1

Элементы данных можно увидеть в элементе: http://cl.ly/0w3V2H311E21241J2j45

Если вы используете jQuerys .data(), он не изменяет атрибуты данных элемента, поэтому вы должны вызвать .data(), чтобы увидеть его. Я не знаю никаких плагинов, которые позволяют вам просматривать его в DOM-проводнике.

Слушатели событий можно найти справа, щелкнув элемент. Прокрутите вниз до нижней части правил CSS, и вы увидите раздел "Слушатели событий": http://cl.ly/2f3c3z312c3D2w43321s

Ответ 2

Извините, если вы ограничены только инструментами разработчика Chrome.

Однако для других, кто может использовать Firefox, может быть полезно знать, что для Firebug существует большое расширение: FireQuery, который делает именно то, что вы просите, плюс другие приятные вещи.

firequery screenshot