修改站点favicon的bookmarklet代码无报错但图标未生效如何解决

• 未覆盖所有favicon的rel类型：绝大多数网站除了rel="shortcut icon"外，还会使用rel="icon"、rel="apple-touch-icon"等多种类型的favicon链接，仅替换/新增shortcut icon类型时，浏览器可能优先读取其他类型的原有favicon。
• 未清理原有favicon标签：两个版本的代码都没有移除页面原本存在的其他favicon标签，浏览器会优先读取原有标签的图标配置。
• 浏览器缓存限制：浏览器对favicon有强缓存策略，仅修改link标签的href不会强制浏览器重新拉取图标，需要添加随机参数跳过缓存。
• 输入内容未做过滤：用户输入的域名可能带有http/https前缀、路径等多余内容，会导致favicon请求接口返回无效结果。

function changeFavicon(domain) {
    // 移除页面所有现有favicon相关标签
    document.querySelectorAll('link[rel*="icon"]').forEach(el => el.remove());
    // 过滤输入内容，仅保留纯域名
    domain = domain.replace(/^https?:\/\//, '').split('/')[0];
    // 添加时间戳参数跳过浏览器缓存
    const iconUrl = `//www.google.com/s2/favicons?domain=${domain}&t=${Date.now()}`;
    // 覆盖所有常用favicon类型，保证不同浏览器都能识别
    ['icon', 'shortcut icon', 'apple-touch-icon'].forEach(rel => {
        const link = document.createElement('link');
        link.rel = rel;
        link.href = iconUrl;
        document.head.appendChild(link);
    });
}

const inputDomain = prompt("请输入要伪装的域名，示例：google.com", "google.com");
// 处理用户点击取消的场景，避免无效执行
if (inputDomain?.trim()) {
    changeFavicon(inputDomain);
}

• 完全移除jQuery依赖，避免加载第三方库的延迟和潜在冲突，更适合bookmarklet的轻量化需求。
• 新增输入校验逻辑，避免用户输入空值或点击取消时的异常执行。
• 覆盖所有主流favicon类型，适配不同浏览器的图标读取规则。

内容的提问来源于stack exchange，提问作者bypassingthesystems