在页面加载

时间:2017-05-07 17:12:37

标签: html google-chrome

我正在尝试创建Google Chrome自定义主题(新标签页上显示的图片)。然而,这些最后访问过的小盒子阻挡了部分图像,并尽可能地尝试,我找不到任何可以摆脱它们的在线扩展或主题。我知道需要做出哪些改变才能实现这一目标;页面的HTML包含以下行:

<div id="mv-tiles" style="opacity: 1;"> == $0

我只需要将style更改为"opacity: 0;"。我可以使用Excel中的静态HTML(使用getElementById("mv-tiles").style = "opacity: 0;"或类似的东西)

来完成此操作

但是,无论何时打开新的标签页 - 不是从Excel,只是使用Chrome主题中的.JSON文件,或者使用某个插件,我该如何动态执行此操作?

更新

我刚刚将提供的代码插入到我的JSON文件中,如下所示 - 然后我在记事本中创建了一个文件,我粘贴了JS代码,将其保存为content.js。最后,我将整个文件夹拖到chrome扩展页面中,将其保存为.crx包,然后安装它。这是我完成的manifest.json文件:

{
  "manifest_version": 2,
  "permissions": [
    "<all_urls>"
  ],
  "content_scripts": [
    {
      "matches": [
        "http://*/*",
        "https://*/*"
      ],
      "js": [
        "content.js"
      ],
      "run_at": "document_end"
    }
  ],
  "theme": {
    "images": [],
    "colors": {
      "frame": [
        66,
        116,
        201
      ],
      "toolbar": [
        223,
        223,
        223
      ],
      "tab_text": [
        0,
        0,
        0
      ],
      "tab_background_text": [
        64,
        64,
        64
      ],
      "bookmark_text": [
        18,
        50,
        114
      ],
      "ntp_background": [
        255,
        255,
        255
      ],
      "ntp_text": [
        0,
        0,
        0
      ],
      "button_background": [
        0,
        0,
        0,
        0
      ]
    },
    "tints": {
      "buttons": [
        0,
        0,
        0.5
      ]
    },
    "properties": {
      "ntp_background_alignment": "bottom",
      "ntp_background_repeat": "no-repeat"
    }
  },
  "name": "Test Theme",
  "version": "1",
  "description": "Removes thumbnails"
}

它没有按预期工作(主题看起来不错,但JS不会运行!)

1 个答案:

答案 0 :(得分:0)

manifest.json

"permissions": ["<all_urls>"],
"content_scripts": [
    {
    "matches": [
        "http://*/*",
        "https://*/*"
        ],
    "js": ["content.js"],
    "run_at": "document_end"         // pay attention to this line
    }
],

并在content.js

(function(window, chrome){
  "use strict";
  var doc = window.document;
  doc.getElementById("mv-tiles").style.opacity = "0";
}(window, chrome));
相关问题