如何调试特定的javascript点击事件？ [英] How to debug a specific javascript click event?

问题描述

在雅虎天气页面上，标有 C 的链接会将温度单位从 Fahrenheit 更改为摄氏度。

我正在调试此操作，并了解在将F转换为C的幕后执行的javascript。调试此类事情的方式是什么？

链接：

On yahoo weather page, there is link labeled as C that changes temperature unit from Fahrenheit to 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?

Link: http://weather.yahoo.com/?w=2295401

解决方案

Using Google Chrome,

1. 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

2. Right Click again on the element from the DOM view and select Break on -> Attributes modifications

3. Now perform the action you want to debug (in this case click the °C item)

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

这篇关于如何调试特定的javascript点击事件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！