shortcut icon图标移动端和PC端设置_shortcut icon用法

之前收到客户的需求，需要在移动端和PC端，使用不同的shortcut icon，很简单的几句代码，记录一下
首先在head里引入小图标

<link rel="shortcut icon" type="image/x-icon" href="./static/favicon.ico" />
1

然后在index.html文件里最后面，新增一个script标签，我以最大767px作为分界线，内容如下：

if(window.matchMedia("(max-width: 767px)").matches) {
    var link = document.querySelector("link[rel='shortcut icon']");
    link.href = './static/miniScreen.ico';
    document.getElementsByTagName('head')[0].appendChild(link);
}
1
2
3
4
5

下面是效果展示