当我在谷歌Chrome中打开开发人员工具时,我看到了各种各样的功能,如配置文件,时间线和审计,但基本功能,如能够在js文件和html和javascript代码中设置断点是缺失的!我尝试使用javascript控制台,它本身就有bug——例如,一旦遇到JS错误,除非刷新整个页面,否则我无法摆脱它。有人能帮忙吗?
当前回答
您谈论的是<script>标记中的代码,还是HTML标记属性中的代码,就像这样?
<a href="#" onclick="alert('this is inline JS');return false;">Click</a>
无论哪种方式,像这样的调试器关键字都可以工作:
<a href="#" onclick="debugger; alert('this is inline JS');return false;">Click</a>
注意:如果开发工具没有打开,Chrome不会在调试器上暂停。
你也可以在JS文件和<script>标签中设置属性断点:
单击Sources选项卡 单击Show Navigator图标并选择文件 双击左侧空白处的a行号。相应的行被添加到Breakpoints面板(4)。
其他回答
对于像我这样的人:只是想
(添加断点)调试正常的js代码 < >脚本…</script>内部/嵌入HTML
步骤:
来源->页面->顶部->找到你的html ->点击->右侧显示html和js脚本->添加断点->调试
你必须将type="text/javascript"添加到脚本块中,以便将它们作为脚本拾取。例如: <script type="text/javascript">…你的代码在这里…> < /脚本
我遇到了这个问题,但是我的内联函数是在一个angularJS视图中。因此,在加载时,我无法访问内联脚本来添加调试,因为只有index.html在调试器的sources选项卡中可用。
这意味着,当我打开特定的视图与我的内联(没有选择在这)是不可访问的。
我能击中它的唯一方法是把一个错误的函数或调用内联JS函数。
我的解决方案包括:
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);
}
这意味着当我点击我的按钮,我就会在chrome控制台提示。
Uncaught TypeError: undefined is not a function
这里重要的事情是它的来源:VM5658:6单击它可以让我遍历内联并将断点保留在那里以供以后使用。
极其复杂的到达方式。但是当处理动态加载视图的单页应用程序时,它是有用的。
虚拟机[n]无显著值,n on等于脚本ID。此信息可以在这里找到:Chrome“[VM]”
在脚本选项卡上打开开发人员工具时,刷新包含脚本的页面。这将在文件列表中添加一个(程序)条目,显示页面的html(包括脚本)。从这里可以添加断点。
你也可以给你的脚本一个名字:
< >脚本 ... (你的代码在这里) / / # sourceURL = somename.js > < /脚本
当然,用一些名字替换“someename”;)然后你会在chrome调试器“Sources > top > (no domain) > someename .js”中看到它作为一个正常的脚本,你将能够像其他脚本一样调试它
推荐文章
- 如何使用Jest测试对象键和值是否相等?
- 将长模板文字行换行为多行,而无需在字符串中创建新行
- Chrome:网站使用HSTS。网络错误……这个页面稍后可能会工作
- 如何在JavaScript中映射/减少/过滤一个集?
- 什么是“升级-不安全-请求”HTTP报头?
- 如何验证一个XPath表达式在Chrome开发工具或Firefox的Firebug?
- Bower: ENOGIT Git未安装或不在PATH中
- 为什么Android工作室说“等待调试器”如果我不调试?
- 添加javascript选项选择
- 在Node.js中克隆对象
- 如何删除所有断点在谷歌Chrome一步?
- 为什么在JavaScript的Date构造函数中month参数的范围从0到11 ?
- 使用JavaScript更改URL参数并指定默认值
- 在window.setTimeout()发生之前取消/终止
- 如何删除未定义和空值从一个对象使用lodash?