Подтвердить что ты не робот

Как установить точки останова DOM в хроме

Я пытаюсь выполнить учебник здесь.

Я застрял в разделе DOM Breakpoints (около дна).

Я пошел на пример сайта, о котором они говорят. Я нажал ctrl + shift + i и перешел на вкладку "элементы". На вкладке элементов я нашел следующий раздел html:

<div id="profileCard" style="position: absolute; left: 403px; top: 135px; visibility: hidden; display: none; " class="goog-hovercard">
</div>

Теперь я застрял, пытаясь найти контекстное меню:

Поднимите контекстное меню в элементе #profileCard и выберите события, которые вы хотите разбить: модификации поддерева, атрибуты изменения и удаление node

Вот скриншот, показывающий, где я:

ss

4b9b3361

Ответ 1

Чтобы установить точки останова в Chrome, поднимите инспектор, как показано выше, и нажмите кнопку "Параметры сценариев" вверху. Это позволит вам просмотреть скрипты, используемые на странице, и вставить точки останова на этой странице. Кроме того, можно выполнить их и другие полезные параметры отладки.

Вышеупомянутый для javascript, чтобы разбить элементы dom, щелкнуть правой кнопкой мыши на элементе (внутри инспектора), который вы хотите разбить, и это вызовет контекстное меню, которое позволит вам разбить модификации поддерева и прочее что.

Ответ 2

Просто хотел добавить, что вы можете просто щелкнуть правой кнопкой мыши элемент на панели элементов и перейдите к:

Break On... и выберите Subtree modifications, Attributes modifications или Node removal

введите описание изображения здесь

Ответ 3

  • открыть панель элементов на devTools.
  • проверить или узнать элемент DOM.
  • щелкните правой кнопкой мыши по нему и выберите break on...

Модификации субтитров. Контрольная точка модификации поддерева запускается, когда дочерний элемент добавляется, удаляется или перемещается.

Изменения атрибутов Изменение атрибута происходит, когда атрибут элемента (класс, имя, имя) изменяется динамически.

Node Удаление. Редактирование удаления node запускается, когда рассматриваемый node удаляется из DOM.

Предоставьте ссылку для упражнений здесь, наслаждайтесь:) Выполнение упражнений DOM Breakpoints