Question

我正在构建一个添加了devtools面板的Chrome扩展程序。我想在面板中使用jQuery来构建和修改（面板，而不是页面）的内容，而不是使用纯JavaScript。

在 devtools.html 中，我添加了对本地jQuery文件和devtools.js的引用：

<script src="jquery-2.2.4.min.js"></script>
<script src="devtools.js"></script>

查看网络选项卡时，我可以看到两个文件都已正确加载（并且devtools.js执行没有问题。）

但是，window.jQuery（或$）永远不会在devtools.js或控制台中提供。

我还尝试在manifest.json中添加它，但没有成功：

"background": {
  "scripts": ["background.js", "jquery-2.2.4.min.js"]
}

我错过了什么？难道我不能在这里使用jQuery吗？

Answer 1

对于那些像我一样从Google提出此问题的人，这是如何将jQuery添加到DevTools控制台中：

var jq = document.createElement('script');
jq.src = "https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js";
document.getElementsByTagName('head')[0].appendChild(jq);
// ... give time for script to load, then type
jQuery.noConflict();

参考/来源：

Include jQuery in the JavaScript Console

在Chrome devtools面板中使用jQuery

1 个答案: