我如何使用带有 javascript 的书签来更改网站 css

Question

我不太擅长颜色，在我辅导的 Moodle 课程中，我很难发现未读帖子和已读帖子的区别。未读的帖子被突出显示，但颜色对我来说与背景太相似了。以前我在 firefox 中使用 javascript 书签来更改网站（select all for Amazon's AWS S3 效果非常好）。

我正在尝试修改 AWS 书签 javascript 以更改 moodle 页面的 CSS。到目前为止我有：

javascript:(function () {
    document.domain = 'whatever.domain';
    var unread = document.querySelectorAll(".unread");
    for (var i = 0; i < unread.length; i++) {
        unread[i].style.background-color="blue";
        };
    })();

使用检查器查看 CSS Span 元素 CSS 如下所示：

#page-mod-forum-view .unread, .forumpost.unread .row.header, .path-course-view .unread, span.unread {
background-color: #FFD;
}

Answer 1

Note that the property names are in camel-case and not kebab-case while setting the style using elt.style. (i.e. elt.style.fontSize, not elt.style.font-size)

https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style

所以您的小书签 JavaScript 代码中应该有 backgroundColor 而不是 background-color。

我如何使用带有 javascript 的书签来更改网站 css

How can I use a bookmark with javascript to alter a website css

javascript

css

firefox

moodle

bookmarks