是否有jQuery的可视化“调试”工具？

Question

我遇到的问题是jQuery没有遍历我的代码的特定部分中的元素，它在其他地方完美无缺地工作。我想知道是否有各种可视化工具（对于任何浏览器，虽然我更喜欢Chrome），这将告诉我jQuery正在做什么，因为它跳过元素？

修改 所以，我应该更清楚。

我可以使用内置的调试器，但它只是向我展示了jQuery正在调用的函数 - 而不是它正在查看的实际元素。我想看看它在DOM中实际看到了什么，因为这个代码在其他4个地方工作，具有完全相同的HTML结构，但它在使用它的第五位仍然失败。

希望这更有意义吗？

Answer 1

调试javascript的最佳方法是使用IE，Chrome和Firefox中的内置工具。您还可以使用FireBug来提供更多信息。我几乎每天使用firebug进行调试，而不仅仅是Javascript

Answer 2

Firefox / Firebug的

FireQuery可以帮助识别哪些元素附加了jQuery事件。如果仅，它可以解析那些实际功能。

Answer 3

尝试Blackbird。它非常适合JS / jquery调试。它可以隐藏并保留在生产中并使用热键[F2]

显示

Answer 4

Firebug :)您可以使用console.log("Put text here / or variables")
然后它出现在萤火虫“控制台”屏幕上：http://getfirebug.com/

Answer 5

据我所知，没有一种工具可以做你想要的，虽然它会非常好。

其他解决方案：

有些人不喜欢这种调试方式，但将alert()放在代码中的战略位置，以输出某些变量的值。

更新正如James Gregory在评论中所说，console.log()会比alert()更好。

另一种方法是我做的，即在页面上一个非常明显的位置添加<div id="debug">，然后.append()值和其他内容，以查看正在发生的事情。

Answer 6

嘿，我会查看QUnit。您必须编写自己的单元测试，但它应该允许您根据需要检查和遍历DOM。