如何使图标保持静态？

Question

我想防止 Mac 上的 Firefox 上的图标发生变化。

我想我也许可以用油猴来做到这一点。

我的目标是防止 Slack 之类的东西更改 Favicon 以指示有通知。

我可以告诉网站他们必须使用加载时相同的图标而不进行更改吗？

Answer 1

您可以编写一个 Greasemonkey 脚本，该脚本使用 Javascript突变观察器来观察 favicon 何时发生变化，然后在您注意到任何情况之前立即将其更改回来。

以下是如何执行此操作：

1. 如果您还没有这样做，请安装Greasemonkey Firefox 扩展（这个问题是关于 Firefox 的，但您也可以使用 Tampermonkey 扩展在 Chrome 和 Edge 上执行此操作：Chrome 的链接，Edge 的链接）

2. 单击顶部栏中的 Greasemonkey 菜单，然后选择“新建用户脚本...”（如果您使用 Tampermonkey，该按钮称为“创建新脚本...”）

   

3. 当您单击该按钮时，它应该会打开一个新选项卡，其中包含一个大文本区域，您可以在其中编写 Javascript 代码。文本区域中可能已经有一些代码。只需删除该代码并将其替换为：

   // ==UserScript==
   // @name         Do not change the favicon
   // @namespace    http://tampermonkey.net/
   // @version      0.1
   // @description  Prevents sites from changing the favicon
   // @author       You
   // @match        http://*/*
   // @match        https://*/*
   // @grant        none
   // ==/UserScript==
   
   (function() {
       'use strict';
   
       //Initialize some variables
       var favicon = document.querySelector("link[rel='shortcut icon']");
       const initialIcon = favicon.href;
   
       //Define the function to run when the favicon changes
       var observer = new MutationObserver(function(){
           if(favicon.href != initialIcon){
               favicon.href = initialIcon;    //Change the favicon back directly when it changes before you notice anything
           }
       });
   
       //Run the function above whenever the favicon changes
       observer.observe(favicon, {attributes: true});
   })();
   

   顶部以//定义脚本属性开头的行。@name定义脚本的名称，并@match定义脚本应在哪些站点上运行（http://*/*意味着https://*/*所有站点）。

   底部的部分是实际的脚本，可防止图标更改。正如我在答案开头所解释的那样，它的作用是检测图标何时发生变化，并在您注意到任何事情之前快速将其更改回来。

4. 按Ctrl+S保存脚本，然后就完成了。