如何使用 Tampermonkey 或 Stylish 将名称为 x.png 的所有图像更改为 x.png？

Question

我目前正在为我的本地路由器制作一个深色主题，它使用的图像很糟糕，我想替换它们，但是在 [=16] 进行了大量研究后添加了 JavaScript =] 还有 Stylish，我找不到任何方法。

我唯一的想法是用另一张图片替换文件名为 wan_up.png 的图片。

Answer 1

在 Stylish 或类似扩展中使用 CSS。

#your-selector-here {
    height: 0 !important;
    width: 0 !important;
    /* these numbers match the new image's dimensions */
    padding-left: 32px !important;
    padding-top: 32px !important;
    background: url(http://example.com/your/image/here) no-repeat !important;
    background-size: 32px 32px; /* modern CSS property to scale the new image */
}

使用 MutationObserver API 改变图像元素在显示之前。

MutationObserver 有很多包装器，这里有一个基于 setMutationHandler:

的例子

// ==UserScript==//
// @name           Replace image
// @match          http://192.168.0.1/*
// @run-at         document-start
// @require        https://greasyfork.org/scripts/12228/code/setMutationHandler.js
// ==/UserScript==

setMutationHandler({
    processExisting: true,
    selector: 'img[src*="wan_up"]',
    handler: images => images.forEach(img => {
        img.src = 'http://foo/bar.png';
    })
});

编辑@match 中的 URL，选择要替换的图像，相应地创建新图像 URL。

如何使用 Tampermonkey 或 Stylish 将名称为 x.png 的所有图像更改为 x.png？

How do I change all images with the name x.png with x.png with Tampermonkey or Stylish?

javascript

stylish

tampermonkey

在 Stylish 或类似扩展中使用 CSS。

使用 MutationObserver API 改变图像元素在显示之前。

如何使用 Tampermonkey 或 Stylish 将名称为 x.png 的所有图像更改为 x.png？

How do I change all images with the name x.png with x.png with Tampermonkey or Stylish?

javascript

stylish

tampermonkey

在 Stylish 或类似扩展中使用 CSS。

使用 MutationObserver API 改变图像元素 在 显示之前。

使用 MutationObserver API 改变图像元素在显示之前。