如何使用chrome瀏覽器進行js調試找出元素綁定的點擊事件


大家有沒有遇到這樣的一個問題,我們在分析一些大型電子商務平台的Web前端腳本時,想找到一個元素綁定的點擊事件,並不是那么容易,因為有些前端腳本封裝的比較隱蔽,甚至有些加密腳本,用傳統的查找元素ID、或者頁面源碼方法去找,可能最后徒勞無功。下面我來介紹利用chrome瀏覽器來查找元素綁定的事件。


只需要通過chrome瀏覽器以下三個功能就可以輕松找到綁定事件了。

1.Sources(源碼)
2.Event Listener Breakpoints(事件監聽斷點)
3.Call Stack(函數調用棧)

舉個栗子:


1.打開某網站,點擊“規格”中的“100x100”選項,按F12,彈出前端調試窗口,切換到Sources標簽。

 

 

 

 

 

 

 

 

2.看右邊的窗口(Event Listener Breakpoints)欄,選擇click選項(監聽點擊事件)。

 

 

 

 

 

3.展開Call Stack(函數調用棧)。

 

 

 

 

 

4.然后點擊如下圖標或按F11,觀察CallStack。

 

 

 

 

 

 

5.一路按如下圖標或按F11,直至發現事件是直接事件源。

 

 

 

一路按下去,一定要有耐心。。。。。

 

 

 

 

到這里已經發現找到了事件源!!!

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM