手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >如何获取网站icon有哪些可行的方法
如何获取网站icon有哪些可行的方法
摘要:获取网站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>

源代码下载

【如何获取网站icon有哪些可行的方法】相关文章:

如何用JS取得网址中的文件名

JS实现简单路由器功能的方法

JQuery自动触发事件的方法

禁止按回车键提交表单的方法

js判断鼠标位置是否在某个div中的方法

js获取字符串字节数方法小结

js获取页面description的方法

jQuery子窗体取得父窗体元素的方法

JQuery中DOM实现事件移除的方法

js兼容火狐获取图片宽和高的方法

精品推荐
分类导航