我在 Chrome 扩展程序弹出窗口中运行脚本时似乎遇到问题。
这里首先是有关我的项目的信息:
文件popup.html包含一个ID为newDetails的按钮和一个<h1>带有类 title 的标签:
popup.html:
<button id="newDetails">Click for details</button>
<h1 class="title">Mr Sanderson</h1>
在名为 background3.js 的文件中，我有以下脚本:
$(document).ready(function() {
console.log("Test");
document.getElementById("newDetails").addEventListener("click", testClick);
});
function testClick() {
$('.title').html("The New Title");
}
在我的 manifest.json 文件中，我有以下内容:
"content_scripts": [ {
"js": [ "jquery.min.js", "background3.js" ],
"matches": [ "http://*/*", "https://*/*"]
}]
我发现这个答案有类似的标题，这就是我添加事件监听器的原因:
但是这也不起作用。我使该函数仅包含 console.log("test")但仍然一无所获。
最终，我想运行一个 AJAX 脚本来从在线 JSON 文件获取详细信息，但我似乎无法让它工作。
如何点击按钮来运行我想要的功能？
附加说明:控制台中没有页面和背景页面的任何内容。
编辑@Makyen
我之前在帖子中放置的 HTML 是 popup.html 文件中的所有 HTML。除了<html> , <head>和<body>标签。
这是您要求的 list 部分:
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
对于您的问题:为什么您将 content_scripts 命名为 background3.js？我从 GitHub 获得了这个用于 Chrome 扩展程序的基本模板应用程序。它说将 JavaScript 文件命名为我想要的任何名称。所以，我只是处理了那里的内容，添加了一个 3，然后将其删除为空白。然后我将上面的代码添加到其中。毕竟，这只是一个学习它的游戏，所以我认为这对名称来说并不重要。
接下来你说:请不要将 jQuery 加载到每个 http 和 https 页面中。这是我得到的模板的一部分。同样不用于生产。但谢谢你的提醒。我不知道，所以我会记下这一点。 :)
您还需要了解什么吗？
最佳答案
如果您想在弹出窗口中使用脚本，则内容脚本不是正确的方法。您需要在popup.html中引用相关脚本。
内容脚本将脚本注入(inject)常规网页。扩展程序页面的域是 chrome-extension://...。
(我对我的英语感到抱歉......)
关于javascript - Chrome扩展程序弹出: running JavaScript,响应按钮点击，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40917541/