javascript 如何调试特定的javascript点击事件？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13334709/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to debug a specific javascript click event?
提问by CuriousMind
On yahoo weather page, there is link labeled as Cthat changes temperature unit from Fahrenheitto Celsius.
在雅虎天气页面上，有一个链接标记为C将温度单位从 更改Fahrenheit为Celsius。
I am looking debug this action and understand what javascript gets executed behind the scenes which convert F into C. What is the way of debug such things?
我正在寻找调试此操作并了解将 F 转换为 C 的幕后执行的 javascript。调试此类事情的方法是什么？
Link: http://weather.yahoo.com/?w=2295401
链接：http: //weather.yahoo.com/? w= 2295401
回答by lostsource
Using Google Chrome,
使用谷歌浏览器，
Right Click on an item which is changing 'visually' when the action you want to debug takes place, and click 'Inspect Element'. In this case we can inspect the temperature value
Right Click again on the element from the DOM view and select Break on -> Attributes modifications
Now perform the action you want to debug (in this case click the °C item)
当您要调试的操作发生时，右键单击正在“视觉上”更改的项目，然后单击“检查元素”。在这种情况下，我们可以检查温度值
再次右键单击 DOM 视图中的元素并选择 Break on -> Attributes modified
现在执行您要调试的操作（在本例中单击°C 项）
You will notice that the code will 'Pause' and you can debug code in the debugger
您会注意到代码将“暂停”，您可以在调试器中调试代码
In this case however, the code is compressed/minified so it will be very tough to understand what is actually going on, but the same approach could be used for other similar situations
然而，在这种情况下，代码被压缩/缩小，因此很难理解实际发生的事情，但可以将相同的方法用于其他类似情况
Update:
更新：
Watch this Chrome Dev Tools video for lots of useful debugging tips: http://www.youtube.com/watch?v=BaneWEqNcpE
观看此 Chrome Dev Tools 视频，了解许多有用的调试技巧：http: //www.youtube.com/watch?v=BaneWEqNcpE
