在Google Chrome中检查jsfiddle.net上的javascript

Question

是否可以使用谷歌浏览器检查器在输入jsfiddle.net的javascript代码中设置断点？

当我进入开发人员工具的脚本选项卡时,我看到很多脚本,但我不知道我的脚本会在哪里找到,或者是否可以在那里找到它.在过去,我刚刚安排了一些console.log动作,但我想设置一些断点.

(如果不可能,我对在这种情况下检查javascript的其他方式感兴趣.)

Answer 1

调试器调用在jsfiddle上正常工作.只需在您想要开始调试的行中输入:

debugger;

调试器非常适合在chrome,firebug甚至IE dev工具中启动调试模式,但是你通常需要启动调试器(即在IE中"开始调试",打开firebug /开发人员工具).

Answer 2

在开发工具,脚本选项卡下,如果你选择fiddle.jshell.net从下拉菜单中,周围线20-30(取决于你有多少CSS有),你会看到一个<script>包含从JavaScript小提琴窗口中的代码标签.您可以在此处设置断点.

您还可以通过更改控制台上下文来评估控制台中针对此框架的代码:

Answer 3

另一个技巧是使用以下语法在没有编辑器的情况下显示您的小提琴:

<normal path to your fiddle>/show/light/

举个例子:jsfiddle-link

Answer 4

从开发人员控制台转到选项卡源,打开源树表示(在左侧),打开fiddle.jsshell.net节点,然后单击_display,下一步(index),您应该看到您的代码.

请注意,如果您保存代码,则此_display引用将替换为fiddle-reference/version/show.例如JsQfE/2/show (据我所知,这不存在,但作为一个例子).