javascript - web调试工具 - 前端浏览器调试




在Chrome调试器中编辑 (8)

如何在Chrome调试器中“动态”编辑JavaScript代码? 这不适合我,所以我无法访问源文件。 我想编辑代码并查看它们对页面有什么影响,在这种情况下,停止动画排队等待很长时间。


This是一个非常棒的Chrome调试器教程。 它显示了对脚本进行调试器更改的非常简单的步骤。


今天我遇到了这个,当时我正在玩别人的网站。

我意识到我可以在调试器中将断点附加到我想要动态编辑的某行代码上 。 而且, 即使在重新加载页面后断点仍然保留 ,我可以在断点暂停时编辑我想要的更改,然后继续让页面加载。

所以作为一个快速解决方案,如果它适合您的情况:

  1. 在脚本的早期点添加一个断点
  2. 重新加载页面
  3. 将您的更改编辑到代码中
  4. CTRL + s (保存更改)
  5. 取消暂停调试器

很容易,转到'脚本'选项卡。 并选择你想要的源文件,然后双击任何一行进行编辑。


您可以在Chrome开发人员工具中的“脚本”选项卡下使用内置的JavaScript调试器(在更高版本中它是“源”选项卡),但您应用于代码的更改仅在执行时通过它们表示。 这意味着对加载页面后未运行的代码的更改不会产生影响。 与例如更改驻留在mouseover处理程序中的代码不同,您可以即时测试该代码。

来自Google I / O 2010活动的视频介绍了Chrome开发人员工具的其他功能。


我正在寻找一种方法来更改脚本并调试该新脚本。 我设法做到的方式是:

  1. 在要更改和调试的脚本的第一行中设置断点。

  2. 重新加载页面,以便断点被击中

  3. 粘贴您的新脚本并在其中设置所需的断点

  4. 按Ctrl + s,页面将刷新,导致第一行中的断点被命中。

  5. F8继续,现在只要没有重定向和重新加载,您新粘贴的脚本就会替换原来的脚本。


现在谷歌铬已引入新功能。 通过使用此功能您可以在Chrome浏览器中编辑您的代码。 (永久更改代码位置)

对于那个按F12 - >源选项卡 - (右侧) - >文件系统 - 在那请选择您的代码位置。 然后Chrome浏览器会询问您的权限,之后代码将以绿色下沉。 你可以修改你的代码,它也会反映你的代码位置(这意味着它会永久改变)

谢谢


这是你正在寻找的东西:

1.-导航到源选项卡并打开JavaScript文件

2.-编辑文件,右键单击它并出现一个菜单:单击保存并保存在本地。

为了查看差异或恢复您的更改,请右键单击并从菜单中选择本地修改 ...选项。 如果您展开显示的时间戳,您会看到相对于原始文件的变化。

更详细的信息在这里: http://www.sitepoint.com/edit-source-files-in-chrome/ : http://www.sitepoint.com/edit-source-files-in-chrome/






debugging