如何在谷歌浏览器中设置embedded式JavaScript中的断点？
当我在Google Chrome中打开开发者工具时，我会看到各种各样的function，例如个人档案，时间轴和审计，但是能够在js文件中以及在html和javascript代码中设置断点的基本function已经丢失！ 我试图使用JavaScript控制台，这本身就是越野车 – 例如，一旦遇到JS错误，我不能摆脱它，除非我刷新整个页面。 有人可以帮忙吗？
使用sources标签，你可以在那里设置JavaScript的断点。 在它下面的目录树（使用上下箭头）中，可以select要debugging的文件。 您可以通过按下同一选项卡右侧的恢复来解决错误。
你是在谈论<script>标签中的代码，还是在HTML标签属性中，像这样？
<a href="#" onclick="alert('this is inline JS');return false;">Click</a>
无论哪种方式，这样的debugger关键字将工作：
<a href="#" onclick="debugger; alert('this is inline JS');return false;">Click</a>
如果开发工具没有打开， NB Chrome将不会在debugger暂停。
你也可以在JS文件和<script>标签中设置属性断点：
- 点击Sources选项卡
- 单击显示导航器图标并select一个文件
- 双击左侧空白处的行号。 相应的行被添加到断点面板（4）。
刷新包含脚本的页面，同时在脚本选项卡上打开开发人员工具。 这将在文件列表中添加一个（程序）条目，其中显示包括该脚本的页面的html。 从这里你可以添加断点。
另一个直观的简单的窍门特别是debuggingajax返回的html内部的脚本，就是临时把console.log（“test”）放在脚本里面。
启动事件后，打开开发人员工具中的控制台选项卡。 你会看到在“test”debugging打印语句右侧显示的源文件链接。 只需点击源代码（如VM4xxx）即可设置中断点。
PS：另外，如果你使用chrome，你可以考虑把“debugging器”声明，比如@Matt Ball
我的情况和我做了什么来解决它：
我有一个JavaScript文件包含在HTML页面如下：
页面名称：test.html
<!DOCTYPE html> <html> <head> <script src="scripts/common.js"></script> <title>Test debugging JS in Chrome</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> </head> <body> <div> <script type="text/javascript"> document.write("something"); </script> </div> </body> </html>
现在在Chrome中inputJavascriptdebugging器，我点击脚本标签，然后下拉列表，如上所示。 我可以清楚地看到scripts / common.js，但是我不能在下拉列表中看到当前的html页面test.html ，因此我无法debuggingembedded的javascript：
<script type="text/javascript"> document.write("something"); </script>
那真是令人困惑。 但是，当我从embedded的脚本中删除过时的type =“text / javascript”时 ：
<script> document.write("something"); </script>
..刷新/重新载入页面，瞧，它出现在下拉列表中，一切都很好。
我希望这有助于任何人在HTML页面上debuggingembedded式JavaScript的问题。
你也可以给你的脚本命名：
<script> ... (your code here) //# sourceURL=somename.js </script>
当然用某个名字replace“somename”;）然后你会在chromedebugging器的“Sources> top>（no domain）> somename.js”中看到它作为一个普通的脚本，你将能够像其他脚本一样debugging它
如果您看不到“脚本”标签，请确保您使用正确的参数启动Chrome。 当我使用参数--remote-shell-port=9222启动Chrome来debugging服务器端JavaScript时，我遇到了这个问题。 如果我没有参数地启动Chrome，我没有任何问题。
我遇到了这个问题，但是我的内联函数是用angularJS视图。 因此，在加载时，我无法访问内联脚本来添加debugging，因为只有debugging器的sources选项卡中提供了index.html。
这意味着当我用内联打开特定的视图时（没有select），这是不可访问的。
我能够打到它的方式是把一个错误的函数或调用内联JS函数。
我的解决scheme包括
function doMyInline(data) { //Throw my undefined error here. $("select.Sel").debug(); //This is the real onclick i was passing to angular.element(document.getElementById(data.id)).scope().doblablabla(data.id); }
这意味着当我点击我的button，然后提示我在铬版。
Uncaught TypeError: undefined is not a function
这里最重要的是这个： VM5658:6点击这个让我可以通过内联步骤并在那里保留中断点。
非常复杂的方式来达到它..但它的工作，并可能被certificate是有用的，当处理dynamic加载您的意见的单页面应用程序。
VM[n]没有显着的价值，而n等于脚本ID。 这个信息可以在这里find： Chrome“[VM]”
使用Visual Studio （2012）我有同样的问题，切换到IIS Express解决了这个问题！
script标签的type属性没有考虑到它。
出于某种原因， Visual Studio Development Server不提供Chrome启用断点所需的一切。
这是Rian Schmits上面答案的延伸。 在我的情况下，我的JavaScript代码中embedded了HTML代码，除了HTML代码，我什么都看不到。 也许Chromedebugging已经改变了多年，但右键单击Sources / Sources选项卡给我提供了添加文件夹到工作区 。 我能够添加我的整个项目，这使我可以访问我所有的JavaScript。 你可以在这个链接中find更多的细节。 我希望这有助于某人。
