Inspecting javascript on jsfiddle.net in Google Chrome

落爺英雄遲暮 提交于 2019-11-27 05:13:32

问题


Is it possible to set breakpoints using the google chrome inspector on javascript code entered into jsfiddle.net?

When I go to the script tab of the developer tools I see lots of scripts but I don't know where my script would be found or if it can be found in there at all. In the past I have just settled for some console.log action but I would love to set some breakpoints.

(If not possible I am interested in other ways of inspecting javascript in this scenario.)


回答1:


In the Developer Tools, under the Script tab if you select fiddle.jshell.net from the dropdown, around line 20-30 (depending on how much CSS you have) you will see a <script> tag that contains the code from the Javascript fiddle window. You can set your breakpoints here.

You can also evaluate code in the Console against this frame by changing the console context:




回答2:


Debugger calls work fine on jsfiddle. Just enter this line where you want to start debugging:

debugger; 

Debugger is great for starting debug mode in chrome, firebug and even IE dev tools, but you usually need to have the debugger started (ie "start debugging" in IE, open firebug/developer tools).




回答3:


Another trick is to show your fiddle without the editor using the following syntax:

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

as an example: jsfiddle-link




回答4:


From the developer console go to tab sources, open the sources tree representation (on the left), open the fiddle.jsshell.net node, next click _display, next (index) and you should see your code.

Note that if you save your code this _display reference will be replaced by fiddle-reference/version/show. For example JsQfE/2/show (which doesn't exist as far as I know but does the job as an example).



来源:https://stackoverflow.com/questions/5655058/inspecting-javascript-on-jsfiddle-net-in-google-chrome

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!