如何获取网站icon有哪些可行的方法_Javascript教程-查字典教程网
如何获取网站icon有哪些可行的方法
如何获取网站icon有哪些可行的方法
发布时间:2016-12-30 来源:查字典编辑
摘要:获取网站icon,常用最简单的方法就是通过website/favicon.ico来获取,不过由于很多网站都是在页面里面设置favicon,所...

获取网站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 = ' nrtfx0bxa0u2000u2001u2002u2003u2004u2005u2006u2007u2008u2009u200au200bu2028u2029u3000';

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教程学习
    编程开发子分类