【问题标题】：Is it possible to change javascript variable values while debugging in Google Chrome?在 Google Chrome 中调试时是否可以更改 javascript 变量值？
【发布时间】：2011-06-03 22:23:35
【问题描述】：

我正在调试一个 javascript 应用程序（使用 Chrome 开发工具），我想在单步执行代码时更改一些变量值。

这可能吗？

我已经尝试并得到了类似的东西：

> modeline
1
> modeline=0
0             <<< seems to work but... 
> modeline
1             <<< ups!!

但我找不到任何说明可以做什么或不可以做什么的文档...

【问题讨论】：

发布一些代码。 modeline 来自哪里？
@Emil：这很重要吗？ modeline 是一个全局变量，我也尝试过使用 window.modeline 对其进行修改，结果相同。但是这个问题也与函数内部声明的局部变量有关
我可以确认这种行为。在 Chrome 中修改 JS 对象的属性似乎对解释器中对象的实际值没有任何影响。在 Firefox 中，相同的修改使 js 脚本的计算结果与您预期的不同。 Chrome peraps 中的某种额外安全性？有谁知道Chrome中能不能把它关掉，这样你就可以用它来调试js了？
为此提交了bug report。
已经在 V8 中实现：Issue 2399 现在 Chromium 的开发者工具需要更新：Issue 124206

标签： javascript debugging google-chrome

【解决方案1】：

为什么这个答案仍然得到支持？

这么多年过去了，还有比这个更好的答案，我赞成它，因为我一直在使用它。改为投票Tyler Collier 的答案。他们解释说您可以在控制台或堆栈跟踪中修改值。无需花招。

过时的答案

现在可以在 chrome 35 中实现这一点（今天是 2014 年 7 月 11 日）。我不知道哪个版本首先允许它。

刚刚在我的机器上测试了@gilly3 示例，它可以工作。

打开控制台，在Sources和标签Snippets，添加一个新的sn-p，粘贴以下代码：

var g_n = 0; function go() { var n = 0; var o = { n: 0 }; return g_n + n + o.n; // breakpoint here }
右键单击 sn-p 名称，单击“运行”（但这不会触发该函数）
在 return 语句处添加断点。
在下面的控制台中，输入go()
并如下所示更改变量值

返回结果g_n + n + o.n是30。

【讨论】：

在the link 提供的Brian's answer 中跟踪此错误的回归。
Chrome 不允许我在 sn-p 中设置断点。

【解决方案2】：

每次运行代码块时修改一个值而不必中断执行流程：

调试器中的“日志点”功能旨在让您将任意值记录到控制台而不会中断。它评估执行流程中的代码，这意味着您实际上可以使用它来动态更改值而无需停止。

右击行号并选择“Logpoint”，然后输入赋值表达式。它看起来像这样：

我发现它对于将值设置为不容易重现的状态非常有用，而无需使用其中的调试行重建我的项目。完成后记得删除断点！

【讨论】：

【解决方案3】：

是的！最后！我刚刚在 Mac 上使用 Chrome 版本 66.0.3359.170（官方构建）（64 位）进行了尝试。

您可以更改范围内的值，如第一张图片，或使用控制台，如第二张图片。

【讨论】：

这似乎也适用于复杂情况（如间隔和触发器）。

【解决方案4】：

为什么这个答案仍然得到支持？

根据Mikaël Mayer's answer，这不再是问题，而且我的答案已经过时（go() 现在在与控制台打交道后返回30）。根据上面gabrielmaldi's comment 中链接的bug report，此问题已于2013 年7 月修复。这让我感到警觉，我仍在获得支持 - 让我认为支持者既不理解问题也不理解我的答案。

出于历史原因，我将在此处保留我的原始答案，但请改为投票Mikaël's answer。

诀窍是不能直接更改局部变量，但可以修改对象的属性。您还可以修改全局变量的值：

var g_n = 0;
function go()
{
    var n = 0;
    var o = { n: 0 };
    return g_n + n + o.n;  // breakpoint here
}

控制台：

> g_n = 10
  10
> g_n
  10
> n = 10
  10
> n
  0
> o.n = 10
  10
> o.n
  10

在设置断点并在控制台中运行这些调用后检查go()的结果，你会发现结果是20，而不是0（但遗憾的是，不是30）。

【讨论】：

2016/01/19 Chrome 最新的琐碎代码 (var a = 1; debugger; console.log(a);) 错误仍然存在...
@Offirmo - 1 已记录。什么是错误？您希望记录什么？
在调试器打开的情况下，在“范围”面板中将a 的值更改为任何值（例如 42），然后恢复：1 被记录
@Offirmo - 不适合我：screenshot。但是，如果我将它包装在一个函数中，那么我会看到你所描述的。有趣的。但是，我可以通过直接在控制台中输入来更改值（我个人觉得这比使用范围面板更容易）。 screenshot 我想我从未尝试在范围面板中更改值。我总是只在控制台中执行更改值的表达式，无论如何这似乎都有效。
我投了赞成票，因为您的答案符合"a good answer" 的所有标准并且您提到了另一个提供更新、更好信息的答案——来自一个接受的答案——给出了它即时可信度。那谢谢啦。并享受投票！

【解决方案5】：

我可以通过控制台中的赋值来修改脚本变量值。看起来最简单。

【讨论】：

【解决方案6】：

我遇到了同样的问题，转到“关于谷歌浏览器”->帮助，它说我需要重新启动浏览器以获取最新更新。

我这样做了，突然之间，我现在可以更改局部变量了。只需在“范围变量”窗口中单击要编辑的变量，然后输入新值。

我确实注意到了一些奇怪的地方，我必须先跳过一些不相关的 var 分配，然后才能更改右侧窗口中的文本（范围变量）。

【讨论】：

如果你使用本地存储来存储属性，你也可以去Resources->LocalStorage直接编辑你保存的属性。

【解决方案7】：

这是 Chrome 开发工具中公认的错误：

http://code.google.com/p/chromium/issues/detail?id=124206

【讨论】：

看起来它已于 2013 年 3 月 21 日修复。我不知道如何判断它会使用哪个版本的 chrome。
@David 他们在 Blink 中修复了它，我们可能需要等待一段时间才能获得使用 Blink 的 Chrome 构建
它在 Chrome 版本 49.0.2623.87 中（再次）被破坏。如果您想提高其重要性，请登录上述链接并为该问题加注星标。

【解决方案8】：

我不知道为什么 chrome 团队不允许这个愚蠢的功能......但我可以成功更改变量值的唯一方法是直接在“Sources”选项卡下的 chrome 编辑器中修改脚本（这会改变刷新页面之前脚本的行为），但是刷新时更改会丢失，所以要小心。

【讨论】：

【解决方案9】：

其实有一个解决方法。复制整个方法，修改它的名称，例如originalName() 到 originalName2() 但修改里面的变量以获取你想要的任何值，或者将其作为参数传递。

那么如果你直接从控制台调用这个方法，它的功能是一样的，但是你可以修改变量值。

如果该方法是自动调用的，则改为在控制台中输入

originalName = null;
function originalName(original params..)
{
    alert("modified internals");
    add whatever original code you want
}

【讨论】：

【解决方案10】：

Firebug 似乎允许您这样做。

【讨论】：

IE 和 Opera Dragonfly 也是如此。
好怀念 Opera Dragonfly -____-

【解决方案11】：

好像没有。

设置一个断点，当它停止切换到控制台时，尝试设置变量。当你给它分配一个不同的值时它不会出错，但如果你在分配后读取它，它是未修改的。 :-/

【讨论】：

好吧……至少你看到的行为和我看到的一样。但是……有可能吗？