Как я могу проверить исчезающий элемент в браузере?



как я могу проверить элемент, который исчезает, когда мышь уходит?
Example dropdown which disappears



Я не знаю, что это идентификатор, класс или что-то еще, но хочу проверить его.



решения, которые я пробовал:



запустить селектор jQuery внутри консоли $('*:contains("some text")') но не повезло в основном потому, что элемент не скрыт, но, вероятно, удален из дерева DOM.



ручная проверка дерева DOM для изменений не дает мне ничего, как это кажется, слишком быстро, чтобы заметить, что изменилось.



успех:



Я был успешен с точками останова событий. В частности-mousedown в моем случае. Просто зайдите в Sources-> Event Listener Breakpoints-> Mouse-> mousedown в Chrome. После этого я нажал на элемент, который я хотел проверить и внутри Scope Variables Я видел некоторые полезные указания.

1109   6  

6 ответов:

(этот ответ относится только к инструментам разработчика Chrome.)

найти элемент, содержащий исчезающий элемент. Щелкните правой кнопкой мыши на элементе и примените " Break on... > Модификации Поддерева."Это вызовет паузу отладчика, прежде чем элемент исчезнет, что позволит вам взаимодействовать с элементом в приостановленном состоянии.

enter image description here

альтернативный метод в Chrome:

пока отображается нужный элемент, нажмите клавишу F8 (или Ctrl+/). Это нарушит выполнение скрипта при замораживании DOM точно так, как есть.

оттуда вы можете использовать Ctrl+Shift+C, чтобы выбрать мимолетный элемент.

Я использую chrome на Mac там я следовал выше шаги, но я постараюсь объяснить немного больше:

  1. щелкните правой кнопкой мыши и перейдите к проверке элемента.
  2. переходим на вкладку источники.
  3. затем наведите курсор на элемент.
  4. затем с помощью клавиш F8 Command(Window) \. Он приостановит экран в статическом состоянии, и элемент не исчезнет при наведении курсора.

в Firebug существуют различные решения для этого:

  1. можно использовать Перерыв На Мутируют внутри панели HTML. (с этим вы также сможете узнать, какой элемент это)
  2. вы можете щелкнуть правой кнопкой мыши элемент и выберите инспектировать элемент с помощью Firebug

также вы можете следовать проблема 551, в котором просит, для того, чтобы временно блокировать определенные события.

Edit:

чтобы узнать, какой это элемент, вы также можете включить параметры панели HTMLВыделить Изменения,Расширить Изменений и Прокрутите Изменения В Поле Зрения чтобы сделать элемент видимым внутри панели HTML.

Себастьян

вы можете просматривать элементы, появляющиеся и исчезающие в инспекторе под элементы. Если вы перейдете к элементу, когда он будет виден, вы сможете увидеть его исчезновение или увидеть его изменение css при изменении его статуса.

Это возможно с firebug в firefox или встроенным инспектором в chrome.

в моем случае, я использовал расширить рекурсивно опция в Google chrome:

действия:

  1. Проверьте выпадающее поле
  2. найти динамический DOM (фиолетовая подсветка)
  3. щелкните правой кнопкой мыши на этом динамическом DOM
  4. выбрать расширить рекурсивно: enter image description here
  5. мы видим, что все элементы есть

здесь демо:

enter image description here

Comments

    Ничего не найдено.