Для того чтобы просмотреть события, связанные с DOM-элементом, в браузере Chrome, и получить полную информацию о функции, которая выполняется при этих событиях, вы можете воспользоваться встроенными инструментами разработчика. Вот шаги, которые вам нужно выполнить:
1. **Открыть инструменты разработки**:
- Нажмите правую кнопку мыши на веб-странице и выберите «Просмотреть код» (или используйте сочетание клавиш `Ctrl` + `Shift` + `I` или `Cmd` + `Option` + `I` на Mac).
2. **Перейти на вкладку Elements**:
- В инструментах разработчика выберите вкладку «Elements» (Элементы), чтобы просмотреть структуру HTML вашего документа.
3. **Выбрать интересующий элемент**:
- Найдите и щелкните на нужный DOM-элемент. Вы также можете использовать инструмент выбора элемента (иконка курсора в верхнем левом углу панели инструментов), чтобы кликнуть на нужный элемент на странице.
4. **Перейти на вкладку Event Listeners**:
- С правой стороны панели «Elements» вы найдете вкладку «Event Listeners» (Слушатели событий). Нажмите на нее, чтобы увидеть все события, привязанные к выбранному элементу.
5. **Просмотр функций обработчиков событий**:
- В списке событий вы увидите типы событий и соответствующие обработчики. Если вы кликните на каждое событие, то сможете увидеть функции, которые привязаны к этому событию. Вы можете кликнуть на ссылку функции, чтобы перейти к коду этой функции в вкладке «Sources» (Исходный код).
6. **Проверка исходного кода**:
- После того, как вы перешли к функции в вкладке «Sources», вы сможете просмотреть полный исходный код функции. Это даст вам представление о том, какие действия выполняются при срабатывании данного события.
7. **Отладка**:
- Вы также можете установить точки останова (breakpoints) в коде функции, чтобы остановить выполнение JavaScript и проанализировать значения переменных в момент вызова обработчика.
Следуя этим шагам, вы сможете получить полную информацию о событиях, связанных с DOM-элементом, и изучить функции, которые выполняются при этих событиях.