如何获取网站icon有哪些可行的方法


Posted in Javascript onJune 05, 2014

获取网站icon,常用最简单的方法就是通过website/favicon.ico来获取,不过由于很多网站都是在页面里面设置favicon,所以此方法很多情况都不可用。

更好的办法是通过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]; 
//补全url 
if (!prohost[1]) { 
prohost[1] = "http://"; 
} 
//抓取ico 
return "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>

源代码下载
Javascript 相关文章推荐
JavaScript判断一个URL链接是否有效的实现方法
Oct 08 Javascript
生成二维码方法汇总
Dec 26 Javascript
jquery+easeing实现仿flash的载入动画
Mar 10 Javascript
基于jQuery实现复选框是否选中进行答题提示
Dec 10 Javascript
Js与Jq获取浏览器和对象值的方法
Mar 18 Javascript
JavaScript实现经典排序算法之插入排序
Dec 28 Javascript
JS实现的自动打字效果示例
Mar 10 Javascript
jQuery结合jQuery.cookie.js插件实现换肤功能示例
Oct 14 jQuery
vue移动端微信授权登录插件封装的实例
Aug 28 Javascript
JavaScript 中 JSON.parse 函数 和 JSON.stringify 函数
Dec 05 Javascript
ES6 Iterator接口和for...of循环用法分析
Jul 31 Javascript
vue 指令和过滤器的基本使用(品牌管理案例)
Nov 04 Javascript
IE6中链接A的href为javascript协议时不在当前页面跳转
Jun 05 #Javascript
网页右下角弹出窗体实现代码
Jun 05 #Javascript
获取中文字符串的实际长度代码
Jun 05 #Javascript
jQuery文件上传插件Uploadify使用指南
Jun 05 #Javascript
IE6-IE9中tbody的innerHTML不能赋值的解决方法
Jun 05 #Javascript
首页图片漂浮效果示例代码
Jun 05 #Javascript
原生js实现fadein 和 fadeout淡入淡出效果
Jun 05 #Javascript
You might like
日本十大最佳动漫,全都是二次元的神级作品
2019/10/05 日漫
Fine Uploader文件上传组件应用介绍
2013/01/06 PHP
php中strlen和mb_strlen用法实例分析
2016/11/12 PHP
Laravel使用消息队列需要注意的一些问题
2017/12/13 PHP
php生成随机数/生成随机字符串的方法小结【5种方法】
2020/05/27 PHP
javascript中普通函数的使用介绍
2013/12/19 Javascript
js对象内部访问this修饰的成员函数示例
2014/04/27 Javascript
深入理解JavaScript系列(38):设计模式之职责链模式详解
2015/03/04 Javascript
JavaScript编程的单例设计模讲解
2015/11/10 Javascript
js实现接收表单的值并将值拼在表单action后面的方法
2015/11/23 Javascript
设计模式中的组合模式在JavaScript程序构建中的使用
2016/05/18 Javascript
JavaScript 数组some()和filter()的用法及区别
2016/05/20 Javascript
jQuery的Each比JS原生for循环性能慢很多的原因
2016/07/05 Javascript
Javascript获取图片原始宽度和高度的方法详解
2016/09/20 Javascript
基于js中this和event 的区别(详解)
2017/10/24 Javascript
详解vue通过NGINX部署在子目录或者二级目录实践
2018/09/03 Javascript
VUE DOM加载后执行自定义事件的方法
2018/09/07 Javascript
小程序简单两栏瀑布流效果的实现
2019/12/18 Javascript
基于JavaScript实现简单抽奖功能代码实例
2020/10/20 Javascript
python实现RSA加密(解密)算法
2016/02/17 Python
利用python写个下载teahour音频的小脚本
2017/05/08 Python
11月编程语言排行榜 Python逆袭C#上升到第4
2017/11/15 Python
Python参数类型以及常见的坑详解
2019/07/08 Python
python Pandas如何对数据集随机抽样
2019/07/29 Python
纽约通行卡:The New York Pass(免费游览纽约90多个景点)
2017/07/29 全球购物
日本最大的彩色隐形眼镜销售网站:CharmColor
2020/09/09 全球购物
工程现场管理求职自荐信
2013/10/02 职场文书
促销活动计划书
2014/05/02 职场文书
大学新生军训方案
2014/05/03 职场文书
2014年自愿离婚协议书
2014/10/10 职场文书
教师正风肃纪剖析材料
2014/10/20 职场文书
2016廉洁从政心得体会
2016/01/19 职场文书
话题作文之自信作文
2019/11/15 职场文书
pytest配置文件pytest.ini的详细使用
2021/04/17 Python
解决Golang中goroutine执行速度的问题
2021/05/02 Golang
详解Vue的列表渲染
2021/11/20 Vue.js