我正在关注一个关于如何为 favicon 制作动画的博客。我没有让它工作,所以我把它分解成几个部分,得出的结论是问题是我没有用生成的数据更新网站图标。控制台告诉我 favicon 未定义且分配失败。<!doctype html><html><head> <base href="/"> <!-- <link rel="icon" type="image/x-icon" href="favicon.ico"> --> <link rel="icon" type="image/png" href="" width=32px></head><script> window.onload = function () { const canvas = document.querySelector('canvas'); const context = canvas.getContext('2d'); if (!!context) { context.clearRect(0, 0, 32, 32); context.beginPath(); context.moveTo(0, 0); context.lineTo(0, 32); context.moveTo(0, 0); context.lineTo(32, 32); context.stroke(); const data = canvas.toDataURL("image/png"); console.log(data); favicon.href = data; } };</script><body> <canvas width="32" height="32"></canvas> <app-root>Loading...</app-root></body></html>我可以看到数据出现在控制台中(假设它是正确的信息垃圾)。但是,下一行无法执行。博客中没有关于favicon是如何定义的,我想知道它是否仅适用于某些浏览器/平台?
1 回答
![?](http://img1.sycdn.imooc.com/5859e2d50001f6bb01000100-100-100.jpg)
qq_笑_17
TA贡献1818条经验 获得超7个赞
它需要是对 favicon 链接的引用:
<link id=favicon rel="icon" type="image/x-icon" href="favicon.ico">
在 javascript 中创建对它的引用:
const favicon = document.getElementById('favicon');
添加回答
举报
0/150
提交
取消