想要获取网页标签图标,首先要了解favicon有哪几种:
1、
<link rel="icon" href="/favicon.ico" type="image/x-icon">
像这种favicon.ico图标可以直接用
window.location.protocol + '//' + window.location.host + '/favicon.ico'
获取 ;
2、
<link rel="shortcut icon" type="image/x-icon" href="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/icon.png?v=1556263038788">
像这种图标和网站域名不一样的,需要用js来获取,link标签有两种,一种是rel="icon",一种是rel="shortcut icon",
const href = document.querySelector('link[rel="shortcut icon"]')?.href || document.querySelector('link[rel="icon"]')?.href
这样就能获取到 favicon.ico啦,实际第一种也能通过这种方式来获取。
3、在chrome浏览器中,有种更简洁的方法能获取网站favicon.ico图标
chrome://favicon/ + 网站访问地址
使用是请考虑兼容性等问题,如果还有其他类型的,欢迎留言