Question

我正在尝试选择github的图标并将其更改为其他图标。

当我检查Github时，该图标显示为：

<link rel="icon" type="image/x-icon" class="js-site-favicon" href="https://assets-cdn.github.com/favicon.ico">

然后我尝试选择并更改它，但是它不起作用。

var link = document.querySelector("link[rel*='icon']");
link.type = "image/x-icon";
link.rel = "shortcut icon";
link.href = chrome.runtime.getURL("img/sampleFavicon.png");

我尝试在w3schools.com上执行相同的操作，而该操作具有(<link rel="icon" href="/favicon.ico" type="image/x-icon">)的相同操作，并且确实成功更改了收藏夹图标。

我可以使用更好的选择器吗？

Answer 1

问题在这里：

github.com页面具有与查询相对应的多个元素：<select>。您希望至少更新最后一个（或全部）。您可以使用：<div id="newID">This is test output to see when jaws...</div> ... <select tabindex="117" id="nodeW477_data" name="nodeW477_data" aria-labelledby="newID">方法来获取所有这些内容。
我没有尝试从Chrome扩展程序中更新图标，而是直接从Chrome开发者工具中更新。尝试使用以下外部图像更新收藏夹图标时：link[rel*='icon'] 它会触发以下错误：
```
document.querySelectorAll
```

这里的一种解决方法是将您的收藏夹图标转换为基本64字符串，然后执行以下操作： link.href = 'https://cdn.sstatic.net/Sites/stackoverflow/img/favicon.ico?v=4f32ecc8f43d'

Chrome扩展程序：更改Github的图标图标

1 个答案: