如何在打开网站时一步步看到javascript正在做什么？

Question

当我打开一个网站时，我希望逐步看到所有渲染过程，因为我按下了一种“下一步”按钮。

在第一页将是空的，然后每次我点击下一个浏览器将呈现下一个项目并停止（DOM或其​​他）并告诉我哪个javascript行被执行，哪个css被应用等等。

有没有办法看到所有这些？

Answer 1

Firebug和Chrome开发者工具等工具可让您逐步debug JavaScript functions。但是，听起来你想要浏览页面渲染，这与JavaScript无关。

我不知道任何实际上暂停渲染的工具，并让您浏览它，但如果您正在进行分析，则应查看Chrome的Timline tab，其中包含详细的视图和有关发生的任何事情的数据在页面上，包括渲染。

Answer 2

您可以将Firebug（Chrome和Firefox），Chrome开发工具（Chrome），Dragonfly（Opera）或IE Developer Toolbar用于IE。

Answer 3

使用优秀的Firebug来调试您的javascript。

Answer 4

或者使用Chrome开发者工具，它也很不错

Answer 5

您可以使用Online JavaScript Tutor来查看代码。