0
206
ViewsHow to get all the favicon from the site, by url
Here is my parser:
let getFavicon = function () {
let favicons = [];
let nodeList = document.getElementsByTagName('link');
for (let i = 0; i < nodeList.length; i++) {
if (
nodeList[i].getAttribute('rel') === 'icon' ||
nodeList[i].getAttribute('rel') === 'shortcut icon'
) {
favicons.push(nodeList[i].getAttribute('href'));
}
}
return favicons;
};
It returns an array of URLs, with all URL favicons.
How can the user get these favicons? when entering the URL in the input and get the favicons.
Like google labels, we enter the URL and get the labels with the favicon
How can I do the same thing?
·
Juan Pablo Isaza
1 answers
Answer question0
I hope this example would help:
let favicons = [];
let nodeList = document.getElementsByTagName("link");
for (let i = 0; i < nodeList.length; i++) {
if ((nodeList[i].getAttribute("rel") === "icon") || (nodeList[i].getAttribute("rel") === "shortcut icon")) {
favicons.push(nodeList[i].getAttribute("href"))
}
}
function searchStringInArray (str, strArray) {
for (var j=0; j<strArray.length; j++) {
if (strArray[j].match(str)) return strArray[j];
}
return -1;
}
const searchTextBox = document.querySelector('input[name="search"]')
searchTextBox.addEventListener('keyup', (e) => {
const searchResult = searchStringInArray(e.target.value, favicons)
if(searchResult != -1){
document.querySelector('.icon').style.background = `url('${searchResult}')`
}
}).icon {
height: 35px;
width: 35px;
display: block;
}<head>
<link rel="shortcut icon" href="https://abs.twimg.com/favicons/twitter-pip.ico" type="image/x-icon">
<link rel="icon" href="https://www.youtube.com/s/desktop/6e57b52d/img/favicon_48x48.png" sizes="48x48">
<link rel="shortcut icon" href="https://cdn.sstatic.net/Sites/stackoverflow/Img/favicon.ico?v=ec617d715196">
</head>
<input name="search" type="text">
<span class='icon'></span>
·
Juan Pablo Isaza
Report
Answer question