javascript - 在 Iframe 中反转/更改 nen html 页面的颜色

Question

我想做的是在我的页面中使用(外部)html 页面。由于我的页面主要颜色是黑色，我想更改/注入(inject) iframe 页面的 css。由于该页面仅在本地运行，因此我没有重新分配技术。

e.g. this page

应该有黑色背景和白色字体。

---

我尝试了几种方法。一种想法是阅读 html 和 replace 例如css 文件，但由于提到的页面通过 Javascript 动态加载，因此它不起作用(对我而言)。也许这是一个好方法？我也对其他方法持开放态度...

Answer 1

这看起来与另一篇文章非常相似，所以 this link或 this link可能有帮助。要点是您可以像这样通过 JavaScript 将父级的 CSS 发送到子级 iframe:

window.onload = function() {
    Array.prototype.forEach.call(window.parent.document.querySelectorAll("link[rel=stylesheet]"), function(link) {
        var newLink = document.createElement("link");
        newLink.rel  = link.rel;
        newLink.href = link.href;
        document.head.appendChild(newLink);
    });
};