从亚马逊、eBay等网站提取eBay图标

Question

我有一个代码，它解析html页面的标题，查找以下列方式声明的ICO图像：

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

例如，使用代码：

image = htmlDoc.querySelector('link[rel="shortcut icon"]');
if (image) {
     imageUrl = image.getAttribute('href');
}

(我没有跨浏览器问题，因为我有扩展的特权)

问题是，每当我访问像http://www.ebay.com或http://www.amazon.com这样的网站时，它们的DOM标题中就没有.ico图像，不过该品牌的.ico图像仍会像往常一样显示。

我的问题是:除了上面提到的方式之外，我们还有其他方法来附加.ico图像吗?或者它们是如何实现的？

Answer 1

大多数浏览器都会在根目录中查找一个favicon.ico，如果没有指定的话。Ebay有这样一个图标，这就是为什么虽然没有在代码中声明，但偏袒显示的原因。

您可能有兴趣知道Google有一个很小的图标API，所以您可能不需要自己实现这个API。

只需创建一个图像标记并将src设置为如下所示：

http://www.google.com/s2/favicons?domain=amazon.com

...and你会得到亚马逊的宠儿。

Answer 2

图标也可以放在网站根目录下，大多数浏览器都会在那里搜索它们。

例如，请参阅http://www.ebay.com/favicon.ico中的eBay图标或http://www.amazon.com/favicon.ico中的亚马逊图标。

Answer 3

根据W3的说法，有两种方法可以在网站上添加一个图标；

方法1 :

rel属性可用于添加偏袒图标。

示例：<link rel="icon" type="image/png" href="http://example.com/myicon.png">

方法2 :

使用预定义的路径。有些浏览器会自动检查此路径，并在存在的情况下显示该图标。默认路径是对服务器根文件夹的"/favicon.ico"尊重。

您提到的没有链接rel标记的网站正在使用第二种方法。您可以通过直接查询预定义的URI来获得偏好图标。