Question

作为rollout of new network site themes的一部分，我经常访问的许多Stack Exchange网站现在都拥有links in posts and comments underlined。

首选非下划线的外观，并且由于我主要使用Chrome（68.0.3440.106（正式版本）（64位））和Edge（42.17692.1004.0），它们似乎没有全局替代设置，所以我安装了Tampermonkey，并根据an example I found on Stack Apps编写了一个小的用户脚本，以及一些我通过在本网站上搜索解决方案而发现的相关代码：

TotalAmount

这似乎基本上可以很好地工作，尽管我确实注意到有时页面加载时会出现简短的链接下划线，然后用非下划线的外观替换掉。

我是否可以做些事情，使我的首选外观更迅速地出现，而不会出现短暂的下划线？

我尝试了// ==UserScript== // @name Remove link underlines on Stack Exchange // @namespace http://tampermonkey.net/ // @version 0.1 // @description try to take over the world! // @author You // @match *://*.stackexchange.com/* // @match *://*.stackoverflow.com/* // @match *://*.mathoverflow.com/* // @match *://*.serverfault.com/* // @match *://*.superuser.com/* // @match *://*.stackapps.com/* // @match *://*.askubuntu.com/* // @grant none // @run-at document-body // ==/UserScript== (function() { 'use strict'; // Your code here... var style = document.createElement("style"); style.appendChild(document.createTextNode("a {text-decoration: none !important;}")); document.head.appendChild(style); })();，该功能消除了闪烁，但是有时这根本无法应用样式更改。

除了一起破解第一个用户脚本外，我在这方面没有经验，所以请解释任何提议的更改的好处和风险。

我选择（并标记了）Tampermonkey是为了与我选择的浏览器兼容，并使我将来能够运行其他用户脚本（包括不限于样式更改的脚本）。

Answer 1

引用：How to change a class CSS with a Greasemonkey/Tampermonkey script?

对于纯CSS /样式更改，Stylus更合适，并且通常胜过Tampermonkey。

无论如何，要避免/减少使用Tampermonkey的闪烁，您要做需要@run-at document-start。。否则，在添加样式之前，页面将基本呈现。 / p>

但是，如果偶尔无法正常工作，则很可能在这些情况下在document.head 可用之前触发。（而且理想情况下，您会在浏览器控制台上看到错误。）

页面CSS（或其他扩展名）使用!important;或通过链接的style属性应用CSS的可能性很小。如果脚本失败，请检查页面源（以及上述浏览器控制台）。

无论如何，根据链接的答案注入CSS并消除不必要的麻烦-您的脚本将变为：

// ==UserScript==
// @name         Stack Exchange, Remove link underlines
// @version      0.2
// @match        *://*.stackexchange.com/*
// @match        *://*.stackoverflow.com/*
// @match        *://*.mathoverflow.com/*
// @match        *://*.serverfault.com/*
// @match        *://*.superuser.com/*
// @match        *://*.stackapps.com/*
// @match        *://*.askubuntu.com/*
// @grant        GM_addStyle
// @run-at       document-start
// ==/UserScript==

GM_addStyle ( `a {text-decoration: none !important;}` );

或者，如果您被诅咒需要支持Greasemonkey 4 +：

// ==UserScript==
// @name         Stack Exchange, Remove link underlines
// @version      0.2
// @match        *://*.stackexchange.com/*
// @match        *://*.stackoverflow.com/*
// @match        *://*.mathoverflow.com/*
// @match        *://*.serverfault.com/*
// @match        *://*.superuser.com/*
// @match        *://*.stackapps.com/*
// @match        *://*.askubuntu.com/*
// @grant        none
// @run-at       document-start
// ==/UserScript==

var D               = document;
var newNode         = D.createElement ('style');
newNode.textContent = "a {text-decoration: none !important;}";

var targ    = D.getElementsByTagName ('head')[0] || D.body || D.documentElement;
targ.appendChild (newNode);

删除Stack Exchange链接的下划线样式而不会闪烁

1 个答案: