首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Chrome javascript调试器断点什么都没做?

在Chrome浏览器中,JavaScript调试器(Debugger)可以帮助开发者找出和修复代码中的错误。当调试器设置了断点时,代码会在断点处暂停执行,以便您可以查看和分析当前的变量、函数和执行上下文。

如果在使用Chrome JavaScript调试器时,断点什么都没做,可能是因为以下原因:

  1. 断点设置不正确:请检查您是否正确地设置了断点。在代码行号旁边点击以创建一个断点,或者在代码中找到您想要暂停的具体位置。
  2. 代码未执行:确保您已经触发了要调试的代码执行。如果代码没有执行,断点自然也不会生效。
  3. 异步代码执行:如果您在异步代码(如Promise、async/await等)中设置了断点,可能会在代码执行完毕之前就已经过了断点。请尝试在异步代码相关的回调函数或者.then().catch()中设置断点。
  4. 缓存问题:有时候浏览器会因为缓存原因,加载旧版本的代码而不是新的代码。请尝试在开发者工具中勾选“Disable cache”选项,或者在加载页面时按下Ctrl + Shift + R强制刷新页面。
  5. 调试器设置问题:检查您的调试器设置,确保它没有被配置为忽略某些类型的代码或者特定的断点。

如果以上方法都不能解决问题,请尝试查看浏览器的控制台(Console)以查找可能的错误信息,或者检查您的代码逻辑是否存在问题。如果您需要进一步的帮助,请随时提问。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

2018年,JavaScript经历了什么

其性能一直稳步提高: [2018-12-24-v8.png] V8引擎当初是为Chrome浏览器开发的,但是早已成为一个独立的项目。...《Refactoring》第2版改用JavaScript 《重构:改善既有代码的设计》大多数人都没看过,但是至少应该听过。这本书刚出了第二版,所有示例代码由Java改成了JavaScript。...这里不妨引用尤雨溪的一句话: 至于重构、设计什么的,我只想说,看的是使用的人的水平,跟用什么语言没那么大关系。水平烂的人用 TS 一样写的是翔一样的代码,看看 java 就知道了。...Microsoft爱上JavaScript 土豪Microsoft似乎爱上了JavaScript,它家的Office 365, MicroSoft Teams以及Skype开始使用JavaScript...in JavaScript 在浏览器市场上,Microsoft曾经通过捆绑Windows打败了网景,不过这些年在Chrome面前一败涂地,现在终于"认输",选择基于Chromium重写浏览器。

69250

如何使用谷歌浏览器 Chrome 更好地调试

本文重点介绍使用 Chrome DevTools 更轻松地对 Web 应用程序进行故障排除的一些最佳做法、关键功能和提示。 什么是谷歌浏览器开发工具?...Console:可以通过控制台查看和运行 JavaScript 代码。 Sources:源代码可在此处获得。你可以调试 JavaScript 代码并添加断点等。 Network:调试网络相关的活动。...每个成员数组包含该事件类型的所有事件,并且可以扩展以探索它们各自的属性,例如它们触发的关联函数。...debug() - 调试函数 为了修复不符合预期的页面、功能或组件,你通常会添加一个“调试器”;声明函数声明以激活调试器并尝试了解它有什么问题。 但是,这需要你手动进入源代码以添加这些调试器语句。...在 DOM 元素上添加断点(属性/模板更改) 有时你可能需要在有条件或动态更改的 DOM 元素上放置断点调试器

3.4K30

Jerry和您聊聊Chrome开发者工具

Chrome开发者工具是Jerry日常工作使用的三大调试器之一。虽然工具名称前面带了个”开发者”, 但是它对非开发人员仍然有用。不信?...使用Chrome的记住密码功能,时间长了忘记密码是什么了。虽然这些密码在Chrome设置里也能找到,但更快捷的方式还是直接在Chrome开发者工具里打印出来。...在浏览器的原生方法里设置断点 这种说法其实并不准确,因为我们没办法在Chrome里查看浏览器原生方法的实现代码,更别提设置断点了。 ?...然后在调试器里继续执行,最终断点在我想要找的位置触发: ? 这就是我要寻找的Angular框架创建包含ngRepeat注释的代码位置: ? 3....详细说明参考我的博客: An example of using Chrome Development Tool to analyze JavaScript garbage collector ?

82630

Jerry和您聊聊Chrome开发者工具

Chrome开发者工具是Jerry日常工作使用的三大调试器之一。虽然工具名称前面带了个"开发者", 但是它对非开发人员仍然有用。不信?...然后就可以随心所欲地修改网页上的内容,比如可以像下图这样做做白日梦: [1240] 使用Chrome的记住密码功能,时间长了忘记密码是什么了。...在浏览器的原生方法里设置断点 这种说法其实并不准确,因为我们没办法在Chrome里查看浏览器原生方法的实现代码,更别提设置断点了。...[1240] 然后在调试器里继续执行,最终断点在我想要找的位置触发: [1240] 这就是我要寻找的Angular框架创建包含ngRepeat注释的代码位置: [1240] 3....有什么办法能让我自己打印的log不会淹没在UI5框架海量的log里呢?办法就是使其成为“万花丛中一点绿"。

2K30

js_调试_01_14 个你可能不知道的 JavaScript 调试技巧

JavaScript 不是一个非常结构化的语言,所以有时很难搞清楚 发生了什么什么时候发生的 。因此 console.trace (console 面板中只需要 trace)就派上用场了。...Chrome 可以解压你的 JavaScript 代码以更加可读的格式呈现。尽管格式化后的代码不可能跟源码一样有用,但至少你可以知道发生了什么。...点击调试器 source 面板下面的 {} Pretty Print 按钮。 ? 8. 快速定位要调试的函数 假设你想在某个函数中设置一个断点。...最常用的两种方式是: 在调试器中找到相应的行并设置一个断点 在你的脚本中添加一个 debugger 以上两种方法,你都必须到你的文件中找到你想调试的那一行。...他们中大部分经过良好的测试且相对来说错误较少。但是,调试器在执行调试任务时还是会进入这些不相关的文件。一个解决办法是将你不需要调试的脚本设置成黑盒。也包括你自己的脚本。

48930

你还在用 console.log 调试 ?

我写这篇文章的目的是让您了解 Chrome 开发工具提供的高效工具,让您可以更好、更快地调试 Javascript 代码。...虽然目前大多数浏览器中的内置开发工具,允许您调试正在浏览的页面,停止在特定代码行上或者在特定语句上执行代码,但在本文中,我们将主要讲解 Chrome 开发者工具。 什么断点?...取消断点 执行错误时停止 场景:您的代码执行产生了错误,但您不想设置断点,因为您不知道何时会抛出错误。 在您的代码中抛出错误,这样就可以查看代码出现了什么问题。 ?...也就是说,函数调用将被跳过,除非您在函数中设置了断点,否则调试器将不会在该函数中停止。 ?...Step Out of function call 上图中发生了什么

1.5K10

JavaScript 开发者需要了解的15个 DevTools 技巧

查找未使用的 JavaScript Chrome 的 Coverage 面板可以让你能够快速找到 JavaScript 有没有被使用。...调试一些三方库(React, Vue.js, jQuery等)或第三方脚本中的问题通常都没什么用,你也不能改这些库。...DevTools 允许脚本被黑盒化,因此即使你选择进入调试器的某个函数,它们也不会在调试器中打开。...使用条件断点 单击 Sources 面板中打开的文件的行号会添加一个断点。它会在执行到这一行的时候暂停脚本,这样你可以单步执行代码来检查变量,调用堆栈等。...断点有的时候并不好用,例如,如果在运行 1000 次的循环的最后一次循环报错了。这时你可以添加一个条件断点,让它仅在满足特定条件时才触发断点,例如 i > 999 。

4.7K20

关于 Node.js 调试,你需要了解的一切

作者 | Craig Buckler 译者 | 核子可乐 策划 | 丁晓昀 Node.js 是一种颇具人气的 JavaScript 运行时,与谷歌 Chrome 浏览器一样采用同款 V8 引擎。...什么是调试? 所谓调试,就是修复软件缺陷的艺术。修复 bug 并不高深,大多数问题其实就是由字符错录或代码行里的小问题引发,但查找 bug 却是无缘艰难。...单击任何行号以设置断点(显示为蓝色标记): 这里的 breakpoint 断点,负责指定调试器应在何处暂停处理。我们可以借此检查程序状态,包括局部和全局变量。...您可以定义任意数量的断点,或向代码中添加调试器语句,这些语句会在调试器开始运行时停止处理。...,并跳转至它调用的任何其他函数 step out: 继续处理至函数末尾,而后返回至调用命令 restart:重新启动应用程序和调试器 stop:停止应用程序和调试器Chrome DevTools

28220

Node.js 项目调试指南

Node.js 是一种流行的 JavaScript 运行时,与谷歌 Chrome 浏览器使用相同的 V8 引擎。它是跨平台的,在创建 Web 服务器、构建工具、命令行工具等方面越来越受欢迎。...什么是调试? 调试是修复软件 Bug 的艺术。修复 Bug 通常很简单,更正一个字符或编辑一段代码就可能解决了问题。...单击任意行号来设置断点(显示为蓝色标记): 断点指定调试器可以暂停处理的位置,这允许我们可以检查程序的状态,包括局部和全局变量。...我们可以定义任意数量的断点或向代码中添加 debugger 语句,这些语句在调试器运行时也会停止处理。...step out : 继续处理到函数结束,返回调用命令 重新启动应用程序和调试器 停止应用程序和调试器Chrome DevTools 一样,你可以右击任何一行来添加: 一个标准的断点

37020

React Native调试技巧与心得

该工具可以有效地追踪布局问题,设置 JavaScript 断点并可深入理解代码的最优化策略。...小技巧: ---- 巧用Sources面板 Sources 面板提供了调试 JavaScript 代码的功能。它提供了图形化的V8 调试器。 ?...断点其实很简单 断点(Breakpoint) 是在脚本中设置好的暂停处。在DevTools中使用断点可以调试JavaScript代码,DOM更新和 network calls。...添加和移除断点 在 Sources 面板的文件导航面板中打开一个JavaScript文件来调试,点击边栏(line gutter) 为当前行设置一个断点,已经设置的断点处会有一个蓝色的标签,单击蓝色标签...做iOS开发的同学知道在Xcode中可以设置全局断点,其实在Chrome 开发者工具中也同样有与之对应的功能,叫“Pause On Caught Exceptions”。

6.7K50

微信小程序开发系列教程三:微信小程序的调试方法

做过前端开发的朋友们,可以一眼就看出这其实就是Chrome的开发者工具。 我在我的微信公众号“汪子熙”上也写过一篇Chrome开发者工具的使用技巧介绍,感兴趣的朋友可以去看看: ? ?...index.js, 单击行号”3”, 然后行号3自动被高亮,说明第3行已经成功设置好了一个断点。...点击“编译”按钮,我们的小程序自动启动,设置在控制器里的断点就自动触发了。这样我们就可以通过单步调试的方式来学习微信小程序控制器的调用上下文了。 ? 微信小程序的调试器在手机上仍然可以打开。...这个调试器和电脑上安装的微信开发者工具相比,仅仅能显示日志和执行一些简单的JavaScript操作,但是不能像电脑上那样,进行JavaScript代码的调试。 ?...我们注意到上图的“command…”输入框可以输入一些简单的JavaScript命令,比如console.log(“Jerry”)。 ? 然后可以在手机的调试器上看到输出的Jerry: ?

1.9K21
领券