如何直接调试线上页面的JavaScript和CSS

对于已经部署到客户现场服务器的上线系统，出现问题以后，解决问题的第一步一般都是搭建模拟环境，以图重现bug。但是对于前端问题（js、css问题），则有更方便、更快捷的解决之道。
基本上有3种方法：
[list]
[*][b]1 使用firebug类似工具[/b] 这类工具都可以在线加断点，直接调试(动态eval的代码调试起来会困难一点)。如opera、IE8、safari和Google Chrome等浏览器都内置调试工具，不需要安装插件。但是这类工具的局限性也很明显：除了可以直接修改css立即见效外，对js只可跟踪调试（找到蛛丝马迹），不能直接修改。
[*][b]2 使用fiddle类似工具[/b] 该类工具本质是“客户端web代理”，因此所有进出的数据均可自由修改。fiddle最强大的功能是AutoResponder，可以把任意线上资源请求转发到本地。因此如果怀疑某个js或者css文件是bug所在，可以先把该文件下载到本地，然后指定浏览器对该文件的请求直接从本地加载。这样一来在本地的修改可以立即见效。
[*][b]3 使用GreaseMonkey类似工具[/b] GreaseMonkey是firefox插件（使用上异常简单，十分有趣），但基本上每个浏览器都有类似工具。安装该类插件以后，可以直接修改网页内容(一般都是针对JavaScript)，并且可以永久生效（可以配置）。
[/list]
以上，第二种方法最值得推荐，只要有个客户端web代理软件就可以。可以做到很通用（fiddle也可以配置为非IE系列其他各种浏览器的本地代理）。

特别感谢lifesinger的启发：[url=http://lifesinger.org/]lifesinger[/url]
参考网址：
[url=http://lifesinger.org/blog/2008/08/how-to-debug-js-css-online/]高人lifesinger的how-to-debug-js-css-online[/url]
[url=http://www.fiddler2.com/Fiddler2/help/AutoResponder.asp]Fiddler2--AutoResponder[/url]
[url=http://zh.wikipedia.org/wiki/Greasemonkey/]Greasemonkey[/url]
[url=http://getfirebug.com/]firebug[/url]