用其他图像替换图像的 Chrome 扩展程序

Question

我怎样才能做一个用其他图像替换图像的 Chrome 扩展程序？

到目前为止，这是我的 ma​​nifest.json 代码：

{
  "name": "HaramB",
  "version": "69.0.420.666",
  "manifest_version": 2,
  "description": "This is HaramB's own extension!",
  "browser_action": {
    "default_icon": "images/icon.png",
    "default_popup": "popup.html",
    "default_title": "HaramB"
  },
  "permissions": [
    "activeTab",
    "https://ajax.googleapis.com/"
  ],
  "icons": {
    "128": "images/icon.png"
  },
  "web_accessible_resources": [
    "images/nicolas.jpg"
  ],
  "content_scripts": [{
    "matches": ["http://*/*", "https://*/*"],
    "js": ["onPage.js"],
    "css": ["onPage.css"]
  }]
}

这是我的 onPage.js 代码：

var picture = "images/nicolas.jpg";
document.getElementsByTagName("img").setAttribute("src", picture);

不要关心 popup.html 或 onPage.css 文件。

这是我希望它处理的 onPage.js 文件，如果不可能，请告诉我。

Answer 1

document.getElementsByTagName() 返回一个元素数组。这意味着您需要遍历数组并单独调用所需的方法，如下所示：

var picture = "images/nicolas.jpg",
    images = document.getElementsByTagName("img");

for (var i = 0; i < images.length; i++) {
    images[i].setAttribute("src", picture);
};

注意：最好使用images[i].src = ... 而不是使用setAttribute 作为detailed in this question