如何获取网站icon

获取网站icon，常用最简单的方法就是通过website/favicon.ico来获取，不过由于很多网站都是在页面里面设置favicon（<link rel="shortcut icon" href="http://example.com/favicon.ico" />），所以此方法很多情况都不可用。

更好的办法是通过google提供的服务来实现：http://www.google.com/s2/favicons?domain=http://www.baidu.com

代码：

<!doctype html>
<html><head><meta charset="utf-8"><style type="text/css">#input {height: 300px;padding: 10px 5px;line-height: 20px;width: 1000px;}#submit {height: 30px;text-align: center;color: #ffffff;line-height: 30px;width: 80px;background-color: blue;margin-top: 20px;}#result {margin-top: 20px;}#result li {height: 40px;line-height: 40px;float: left;margin: 10px 14px;}</style>
</head><body><textarea id="input" placeholder="输入多个网址以空格间隔"></textarea><div id="submit">获取icon</div><ul id="result"></ul><script type="text/javascript">var input = document.getElementById("input");var submit = document.getElementById("submit");var result = document.getElementById("result");var val;function trim(str) {var whitespace = ' \n\r\t\f\x0b\xa0\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u200b\u2028\u2029\u3000';for (var i = 0, len = str.length; i < len; i++) {if (whitespace.indexOf(str.charAt(i)) === -1) {str = str.substring(i);break;}}for (i = str.length - 1; i >= 0; i--) {if (whitespace.indexOf(str.charAt(i)) === -1) {str = str.substring(0, i + 1);break;}}return whitespace.indexOf(str.charAt(0)) === -1 ? str : '';}function getFavIconUrl(url) {var prohost;prohost = url.match(/([^:\/?#]+:\/\/)?([^\/@:]+)/i);prohost = prohost ? prohost : [true, "http://", document.location.hostname];//补全urlif (!prohost[1]) {prohost[1] = "http://";}//抓取icoreturn "http://www.google.com/s2/favicons?domain=" + prohost[1] + prohost[2];}submit.onclick = function() {val = input.value;if (!val) alert("输入为空！");val = val.split(" ");val.forEach(function(item) {item = trim(item);if (!item) return;result.innerHTML += "<li>" + item + "<img src='" + getFavIconUrl(item) + "'></li>";});};</script>
</body></html>

源代码下载：http://files.cnblogs.com/shinnyChen/getIcon.rar

后记：

对于国内的网站，也可以使用360的服务：

http://cdn.website.h.qhimg.com/index.php?domain=www.baidu.com

转载于:https://www.cnblogs.com/shinnyChen/p/3722562.html

如何获取网站icon相关推荐

教你如何获取网站icon图标！！
网站的图标一般都放在根目录,文件名为favicon.ico,比如android开发者社区(juapk)图标网址是: http://www.juapk.com/favicon.ico
favicon自动获取_php获取网站favicon.ico图标 api源码自动获取并添加Favicon图标
通常情况下,做网站的都会给自己的网站添加一个Icon,浏览器上一长排的标签页,用Icon来区分就显得更加醒目.现在想找一个没有Icon的网站并不好找,可见没有Icon的网站是多么的业余啊." ...
获取网站的浏览器上的icon图标
获取网站的浏览器上的icon图标 http://www.im286.com/favicon.ico 把前面的域名换成你要获取的网站
如何获取网站的icon
制作网站时,网站的icon很重要,一些导航页也会允许自己自定义网站的图标,这个时候能找到网站合适的图标就很重要.以下是两个简单的获取网站图标的方式: 1.直接使用/favicon.ico 很多网站在主 ...
favicon自动获取_wordpress网站友情链接页面使用DNSPod自动获取网站favicon图标教程...
在网站的友情链接页面,经常可以看到网站的图标增加美感.在以前,有些是直接使用favicon.ico地址读取,但是确有弊端那就是很多网站首页并没有favicon.ico,就不可靠.还有一部分人采用的是谷 ...
使用PHP获取网站Favicon的方法
使用PHP获取网站Favicon的方法 Jan022014 作者:Jerry Bendy 发布:2014-01-02 23:18 分类:PHP 阅读:4,357 views 20条评论 ...
获取网站 favicon.ico 的三种方法
获取网站 favicon.ico的三种方法方法一: 直接在网站网址后面加favicon.ico 例如:https://www.baidu.com/favicon.ico (有一些网站可能会直接跳转到 ...
自建导航页，如何获取网站在浏览器上显示的图标
网站图标在访问一个网站时,通常会在浏览器标签的左上角显示网站对应的图标. 在做自定义导航这类页面时,为了显示效果,通常会把网站图标显示出来. 一.如何获取网站图标在通常情况下,只需要在网站域名后加 ...
怎样获取网站的域名_搭建一个网站，通常的6大步骤你知道吗？
怎样建网站?要搭建一个网站,通常有6个步骤.下面我们简单的介绍如何一步一步搭建网站. 第一步:注册域名挑选网站地址,注册专属域名.注册域名的价格取决于具体用什么样的后缀域名搭建网站.目前可以选择的域 ...

如何获取网站icon

后记：

如何获取网站icon相关推荐

最新文章

热门文章