javascript – 消息：SyntaxError：missing：属性id之后

我正在尝试学习如何为firefox做简单的添加.我的基础是this tutorial.

这是我的代码：

LIB / main.js

var self = require("sdk/self");

var button = require("sdk/ui/button/action").ActionButton({
  id: "style-tab",
  label: "Style Tab",
  icon: "./icon-16.png",
  onClick: function() {
    require("sdk/tabs").activeTab.attach({
        contentScriptFile: [self.data.url("jquery.js"), self.data.url("edit-page.js")]
    });
  }
});

数据/编辑page.js

$("body div").css("visibility", "hidden");
$("body").append( $("#addon_hide_page") );

var styles = {
    width: "100%",
    height: "100%",
    backgroud-color: "gray"
}

$("body #addon_hide_page").css(styles);

错误输入到此问题的标题中：“消息：SyntaxError：missing：after property id”.正如所见：“id”后面有一个“：”(main.js中的第四行).发生什么了？

BTW：有没有比在Windows CMD中阅读那些无用语句更好的方法来调试firefox插件？

解决方法:

在data / edit-page.js中,你不能拥有一个名为background-color的属性,破折号会混淆它.你必须把它放在引号中.所以：

$("body div").css("visibility", "hidden");
$("body").append( $("#addon_hide_page") );

var styles = {
    width: "100%",
    height: "100%",
    "backgroud-color": "gray" ////////////////fix here
}

$("body #addon_hide_page").css(styles);

调试的最佳方法是使用浏览器控制台.
设置开发首选项(安装此插件：DevPrefs),然后按Ctrl Shift J并查看错误消息.使用console.log console.info console.warn和console.error将消息记录到Browser Concole中.执行console.log(objectName)并在浏览器控制台中单击该对象,它将显示其中的内容.

标签：javascript,firefox,firefox-addon,firefox-addon-sdk
来源： https://codeday.me/bug/20190612/1225588.html