How to catch the click event on an element in developer tools?

Question

JavaScript

for example, there is a website, it has 100,500 thousand scripts and even more lines of code, there is a button, how to catch it through "debug" to find out which code is triggered by the button?

Answer 1

My answer about the "Event Listeners" list in the developer tools is still relevant, and in the case of the site you provided, you should have looked at the code at least once. What happened to me: there are no corny handlers on the #write button , and since it opens a modal, then I looked at the overlay code. The overlay has id="write" , already here it becomes clear that this is no accident. I open modal.css and the first line says "Modal windows in pure CSS, no javascript" , then I look at what's going on with the overlay, I find the following lines: .overlay:target and .overlay:target+.popup . Open MDN , read - :target describes the styles that are applied to an element if its ID matches the current URL hash. Conclusion: the only way to call the modal is to change the URL of the page, you can do this either using JS or using anchor links, like these:<a href="#write">text</a>