javascript - Extract .ico icon from sites like Amazon, eBay - Stack Overflow

admin管理员组

文章数量:1417710

I have a code that parses an html page's header looking for ICO images that declared in the following way:

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

for example with the code:

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

(I don't have cross browser issues, because I have an extension's privileges)

The problem is whenever I go to such sites like , or , they don't have .ico image in their DOM's header, nevertheless the brand's .ico image is displayed as usual.

My question is: Do we have some other ways to attach .ico images beside the way mentioned above or how do they do it?

I have a code that parses an html page's header looking for ICO images that declared in the following way:

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

for example with the code:

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

(I don't have cross browser issues, because I have an extension's privileges)

The problem is whenever I go to such sites like http://www.ebay., or http://www.amazon., they don't have .ico image in their DOM's header, nevertheless the brand's .ico image is displayed as usual.

My question is: Do we have some other ways to attach .ico images beside the way mentioned above or how do they do it?

• javascript
• html

Share Improve this question Follow edited Dec 15, 2015 at 21:02 GoOlga asked Dec 15, 2015 at 20:50 GoOlgaGoOlga 23411 silver badge88 bronze badges 2

• en.wikipedia/wiki/Favicon // Originally, the favicon was not explicitly linked or referenced anywhere, browsers just assumed it to be available under the name favicon.ico in the root directory of the site. – C3roe Commented Dec 15, 2015 at 20:55
• else{ imageUrl = '//' + websiteName + '/favicon.ico'; } – Mi-Creativity Commented Dec 15, 2015 at 21:07

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 7

Most browsers will look for a favicon.ico in the root directory if no favicon is specified. Ebay has such an icon which is why the favicon is showing even though it's not declared in code.

You may be interested to know that Google has a small API for favicons, so you may not need to implement this yourself.

Simply create an image tag and set the src to something such as:

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

...and you will get the Amazon favicon.

Favicons can also be put to the websites root and most browsers will try to search for them there.

For example, see http://www.ebay./favicon.ico for the eBay icon or http://www.amazon./favicon.ico for the Amazon favicon.

According to W3, there are two methods to add a favicon to a website ;

Method 1 :

rel attribute could be used for adding favicon.
Example : <link rel="icon" type="image/png" href="http://example./myicon.png">

Method 2 :

Using the predefined path. Some browsers automatically checks for this path and displays the favicon if it is exists. Predefined path for favicon is "/favicon.ico" respect to the server's root folder.

Websites you mentioned that have no link rel tag are using the second method. You can get the favicon by directly querying that predefined URI.

本文标签： javascriptExtract ico icon from sites like AmazoneBayStack Overflow