Google Chrome Javascript 调试器和内容脚本

发布于 2024-07-21 13:17:17 字数 594 浏览 6 评论 0原文

之前也曾类似地提出过此问题,但我似乎无法在 Google Chrome 中调试 Javascript。

如果我转到页面> 开发人员禁用了“调试 Javascript”(Ctrl+Shift+L)。 Alt + ` 不起作用。

我正在开发一个“内容脚本”扩展,因此我使用 --enable-extensions 启动 chrome。

我理想的做法是设置断点并在脚本执行时单步执行/运行它。 当谈到 JavaScript 时,我有点不知所措,所以任何指导都是值得赞赏的。

我可以访问“JavaScript 控制台”,但找不到其中的内容脚本。 我也不确定这与“JavaScript 调试器”有何不同。

我在 Windows XP 上使用最新的 Chrome 开发版本 (2.0.181.1)。

This question has been asked similarly before, but I can't seem to debug Javascript in Google Chrome.

If I go to Page > Developer the "Debug Javascript" (Ctrl+Shift+L) is disabled. Alt + ` doesn't work.

I'm developing a 'content script' extension so I'm launching chrome with --enable-extensions.

What I'd ideally like to do is set breakpoints and step/run through my script as it executes. I'm a little over my head when it comes to JavaScript, so any guidance is appreciated.

I can get to the 'JavaScript Console,' but can't find the content scripts inside of that. I'm also not sure how that differs from the 'JavaScript Debugger.'

I'm using the latest Dev build of Chrome (2.0.181.1) on Windows XP.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

逆蝶 2024-07-28 13:17:17

将以下命令放入您的脚本中:

debugger;

这将在到达该点时启动 Javascript 调试器

Put the following command in your script:

debugger;

That will launch the Javascript debugger when it gets to that point

深海里的那抹蓝 2024-07-28 13:17:17

这些答案似乎都已经过时了,因为这在谷歌中排名很高,所以这是最新的答案:

在 Chrome 中按 CTRL+SHIFT+i 调出开发人员工具。

选择“来源”

单击小箭头,您可以从脚本中进行选择
在此处输入图像描述

然后选择“内容脚本”

在此处输入图像描述

然后,您需要知道扩展程序的 ID(可从 chrome 管理扩展程序页面获取)才能访问脚本并正常调试它们。

These answers all seem to be out of date, and since this is ranking highly in google, here's the up-to-date answer:

In Chrome press CTRL+SHIFT+i to bring up the developer tools.

Select 'Sources'

Click the small arrow that allows you to select from the scripts
enter image description here

Then select 'Content scripts'

enter image description here

You'll then need to know the id of your extension (available from the chrome manage extensions page) to get to your scripts and debug them as normal.

终难遇 2024-07-28 13:17:17

右键单击并选择 Inspect Element,您将在其中找到 JS 调试器以及其他调试工具。 JS 调试器应该允许您设置断点等。

Right-click and select Inspect Element, there you'll find the JS debugger, among other debugging tools. The JS debugger should allow you to set breakpoints, etc.

满意归宿 2024-07-28 13:17:17

您要做的就是启用您的扩展程序,然后在 Chrome 中单击“开发人员”-> “Javascript 控制台”。 然后单击“脚本”选项卡。 之后,您应该会在所有加载的脚本下方看到一个列表。 您将看到当前页面的脚本以及已安装的任何扩展的所有脚本。 (如果打开控制台后没有看到任何脚本列出,则可能需要刷新)

似乎所有 Chrome 扩展程序都分配了一个唯一的 ID。 您可以通过在开发者模式下查看 Chrome 扩展程序页面来找到您的 ID。

然后只需在下拉列表中搜索脚本即可。 选择您的脚本,您可以设置断点等。

这里有关于 Chrome 开发工具的更多信息:
http://www.chromium.org/devtools

What you have to do is enable your extension, then in Chrome click "Developer" -> "Javascript Console". Then click the "Scripts" tab. After that you should see a listing just below of all the loaded scripts. You will see scripts for the current page as well as all the scripts for any extensions you have installed. (If you don't see any scripts listed after opening the console, you may have to refresh)

It seems that all Chrome extensions get assigned a unique ID. You can find out your ID by viewing the Chrome Extensions page in Developer Mode.

Then it's just a matter of searching through the scripts in the dropdown for your script. Select your script and you can set breakpoints etc.

There's a lot more info on the Chrome Dev Tools here:
http://www.chromium.org/devtools

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文