今天在調試bug的時候有一個需求，我需要知道我的代碼中有哪些地方在修改body的style，然後我想到了DOM節點監聽。 為body添加斷點然後開始調試，但是現在的前端技術棧太複雜，即使打了斷點也會跳進第三方包里。調用棧里有太多無關的js代碼，妨礙調試。 所以你可以選中文件右擊後，選擇Blackbo ...
今天在調試bug的時候有一個需求，我需要知道我的代碼中有哪些地方在修改body的style，然後我想到了DOM節點監聽。
為body添加斷點然後開始調試，但是現在的前端技術棧太複雜，即使打了斷點也會跳進第三方包里。調用棧里有太多無關的js代碼，妨礙調試。
所以你可以選中文件右擊後，選擇Blackbox script，這樣調試的時候就會跳過該文件。
但這隻適合引用第三方包很少的情況使用，如果文件過多你可以F1調出設置面板，然後在Blackboxing裡面依據路徑設置一個正則匹配，下麵是只要不在src里的文件都加入黑盒。
當然這個正則不完全正確，但是已經能攔截大部分文件了。
其實大部分的bug可能看控制台更快，但是如果你遇到某些疑難雜症，用常規方法解決不了，用好這些調試工具，或許可以給你一些靈感。
我使用的chrome版本61.0.3163.100
