按钮不'不能在自定义镀铬扩展中工作

Button doesn't work in custom chrome extension

本文关键字：扩展 工作 自定义 不能 按钮      更新时间：2023-09-26

我试图制作一个显示日期的chrome扩展，除了尝试运行它之外，一切都很顺利。我点击了我编码的按钮，它不会显示我想要的内容。

代码：

JS

function myFunction() {
    var d = new Date();
    var weekday = new Array(7);
    weekday[0] = "Sunday";
    weekday[1] = "Monday";
    weekday[2] = "Tuesday";
    weekday[3] = "Wednesday";
    weekday[4] = "Thursday";
    weekday[5] = "Friday";
    weekday[6] = "Saturday";
    var n = weekday[d.getDay()];
    document.getElementById("checkday").innerHTML = n;
HTML

<!doctype html>
<html>
<head>
  <title>Day checker</title>
  <script src="popup.js"></script>
</head>
<body>
  <h1>Click to show day</h1>
  <button id="checkday">Check!</button>
</body>
</html>

JSON

{
    "manifest_version": 2,
    "name": "What day is it",
    "description": "This extension will find the date",
    "version": "1.0",
    "browser_action": {
        "default_icon": "icon.png",
        "default_popup": "popup.html"
    },
    "permissions": [
        "activeTab"
    ]
}

图像（19x19）https://i.stack.imgur.com/FM9wt.png

加载DOM内容后，必须动态链接操作。由于安全原因，静态链接的操作（例如onClick属性）不能与Chrome扩展一起使用。

在你的js文件（popup.js）中，添加这个

document.addEventListener('DOMContentLoaded', function(){
  document.querySelector('#checkday').addEventListener('click', myFunction);
  // anything else you want to initialize on the page
});

这应该会让它发挥作用。

相关文章：