Сегодня расскажу как при помощи jquery можно получить фавиконки у сторонних сайтов. Например для использования в профиле пользователя или при отображении комментов.
Для получения вафиконки нам понадобится следующая функция:
function fav_ico () {
$('a.ext[href^="http://"]').filter(function(){
return this.hostname && this.hostname !== location.hostname;
}).each(function() {
var link = $(this);
var faviconURL =
link.attr('href').replace(/^(http:\/\/[^\/]+).*$/, '$1')+'/favicon.ico';
var faviconIMG = $('')['insertBefore'](link);
var extImg = new Image();
extImg.src = faviconURL;
if (extImg.complete)
faviconIMG.attr('src', faviconURL);
else
extImg.onload = function() { faviconIMG.attr('src', faviconURL); };
});
}
UPD В комментариях предложили использовать кеш фавиконок гугла, тоже неплохой вариант:
$('Селектор').each(function(){
site=this.href.split('/')[2];link=this.href;data=this.innerHTML;
if($(this).find('img').length==0 && link.indexOf('mailto')!=0){
$(this).before('<img alt="" style="width:16px;height:16px;vertical-align:middle;" src="http://www.google.com/s2/favicons?domain='+site+'" border="0" /> ');}
});
Отлично пишете. С большим удовольствием читаю Ваши статьи.
А лучше и проще так вот:
http://www.google.com/s2/favicons?domain=сайт
:]
$('Селектор').each(function(){site=this.href.split('/')[2];link=this.href;data=this.innerHTML;
if($(this).find('img').length==0 && link.indexOf('mailto')!=0){
$(this).before('<img alt="" style="width:16px;height:16px;vertical-align:middle;" src="http://www.google.com/s2/favicons?domain='+site+'" border="0" /> ');}
});
кода меньше + png формат лучше
favicon.ico не всегда лежит прямо в корне сайта и имя может быть не favicon.ico вовсе, а какое-нибудь там site.ico, т.е. вот, например, так:
<link href="http://www.site.com/xxx.ico" rel="SHORTCUT ICON">
Сервиса подобные гуглу и яндексу позволяют выводить иконку и оттуда..
..хотя и гугл так же видит иконку только из корня, он хотя бы не крэшит изображение,а выводит симпатичный глобусик.
Есть и альтернативы:
http://favicon.yandex.net/favicon/site.com
http://www.getfavicon.org/?url=site.com/favicon.png
— выводят фавиконку где бы она не лежала, НО если указан сайт на котором иконки нету, то яндекс выводит пустоту, а getfavicon выводит страшное до боли подобие глобуса.. почему-то зеленого цвета… это мне не нравится и я дабы не портить дизайн использую гугл :) такие пироги..
яндекс всё же тоже мудак — не все фавиконки выводит
чем лучше и проще? Сайт то всегда отдаст свой фавикон (если он не лежит конечно), а вот гугл фавикон сайта — нет