如何在javascript中动态地改变favicon?(附实例）在本教程中，一个例子涵盖了如何以编程方式改变favico

在本教程中，一个例子涵盖了如何以编程方式改变favicon。

有时，我们需要动态地将favicon图标改为一个新的图标。

例如，一个favicon在HTML标题标签中使用一个链接标签声明。

<head>

<link id="favicon" rel="shortcut icon" type="image/png" href="assets/favicon.png" />
</head>

href是一个favicon的位置

使用javascript动态地改变favicon？

首先，使用Document API获取链接元素。querySelector 方法选择一个带有id="favicon" 的元素。

const faviconLink = document.querySelector('#favicon');

同样地，你可以用以下方法获得链接元素rel='shortcut icon'

const faviconLink=document.querySelector("link[rel='shortcut icon']");

接下来，用新的favicon网址改变href。

faviconLink.href = 'newfavicon.ico';

下面是一个完整的javascript代码例子。

const faviconLink = document.querySelector('#favicon');

faviconLink.href = 'newfavicon.ico';

如果你在你的应用程序中使用jquery，那就很容易做到了

$("link[rel='shortcut icon']").attr("href", "newfavicon.ico"); or 
$("link['#favicon']").attr("href", "newfavicon.ico");