我是 Chrome 扩展新手。我正在尝试制作一个基本扩展，每隔几秒钟更新弹出页面中输入字段的值。这是我当前的代码。
list .json
{
"manifest_version": 2,
"name": "Test extension",
"version": "1",
"browser_action": {
"default_icon": "tl.png",
"default_popup": "layout.html"
},
"background": {
"scripts": ["jquery-3.2.1.min.js","addvalues.js"],
"persistent": false
},
"permissions": [
"alarms",
"tabs",
"webNavigation"
]
}
布局.html
<html>
<head>
<script src="jquery-3.2.1.min.js"></script>
<script src="addvalues.js"></script>
</head>
<body>
<label for="pfvalue"> Portfolio value </label>
<input id="pfvalue" readonly style="border:0; color:#f6931f; font-weight:bold; padding-bottom: 10px;">
</body>
</html>
addvalues.js
$(function()
{
var i=0;
var portvalue;
function getData()
{
portvalue = i;
$("#pfvalue").val(portvalue);
i++;
console.log(portvalue);
}
getData();
chrome.alarms.create("fetch data",{periodInMinutes: 0.1});
chrome.alarms.onAlarm.addListener(getData);
});
当我将弹出页面打开足够长的时间时，输入值确实会像预期的那样发生变化。但是当我关闭它然后再次打开它时，弹出页面重置为显示 0 的初始状态。我无法弄清楚为什么会发生这种情况。
控制台显示正确的 portvalue 值(即每 6 秒更新一次的值)。
提前致谢。
最佳答案
- 请务必阅读 extension architecture overview :弹出窗口是一个单独的页面，仅在显示时才存在。要查看其开发工具和控制台，请右键单击弹出窗口，然后单击“检查”。
- 背景/事件页面是一个单独的隐藏页面，具有自己的 DOM，因此无需在那里加载 jQuery。
- 您的后台页面可以增加该值并通过
chrome.storage.local.set存储它 - 您的 popup.js(不同的脚本)可以在启动时使用
chrome.storage.local.get并使用chrome.storage.onChanged来检测更改 - 如果您每 6 秒唤醒一次事件页面(manifest.json 中的
"persistent": false)，则使用它是没有意义的，因为事件页面会在自上次访问后 5 秒后自动卸载激活，这意味着您的事件页面当前每 6 秒卸载一次，仅持续 1 秒。这是对计算机资源的浪费:每次加载浏览器都需要解析它、编译它、优化它等等。
关于javascript - 在 Chrome 扩展中对 popup.html 进行更改并反射(reflect)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44963836/