, размещая соответствующий код jQuery при нажатии на HTML

Question

Когда код jQuery полностью отделен от HTML, код становится намного более компактным и более простым в обслуживании. Но это делает отладку и исследование базового кода более сложным.

Вопрос в том, есть ли простой способ (с использованием Chrome DevTools) найти соответствующий код jQuery для определенного HTML.

Давайте разберемся с примером. Скажем, у нас есть такой HTML;

<i class="icon-chevron-right navigation-arrow"></i>

Этот HTML отображает стрелку вправо. Хотя HTML не предполагает, что эта стрелка является кликабельной, пользователь получает точку и нажимает на эту стрелку, и все происходит. Предположим, что щелчок приносит следующий отзыв в какой-то div. И каждый щелчок по этой стрелке продолжает приносить следующий отзыв, и это все, что нужно.

Теперь ... если вы хотите отладить это, вы, естественно, включите панель инструментов Dev и отметьте эту стрелку, но затем что ... Нет имени функции или чего-то подобного, что приведет вас к скрипт.

Мы знаем, что есть какое-то событие клика, явно связанное с этим значком, но где этот код?

Возможно, есть простой способ понять это. Отсюда вопрос ...

Answer 1

Я добавил бы console.debug('arrow click handler called', this, arguments); на обработчике, и у вас появится внешний вид на веб-консоли разработчика с ссылкой на исходную строку, которая сделала звонок. Должен также работать и с другими браузерами.