采用JS的方式获取Typecho友情链接Favicon图标

今天我们来讨论一下，在Typecho博客中友情链接Favicon图标的实现原理以及通过JS实现友情链接Favicon图标的办法。获取Favicon图标的实现原理：获得每个友情链接的地址，提取出域名部分，提交给 Google，Google 返回的就是一个16×16的 PNG 图片，对于没有被 Google 缓存 Favicon 的网站，会得到一个小地球的蓝色图标。

通过JS友情链接获取Favico图标的方法：

第一步：先检查自己的Typecho博客主题是否有加载jQuery库，通常是在header.php文件的head> /head> 之间，如果没有就把下面代码添加到head> /head> 之间

script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js">
    /script>
    

第二步：加载jQuery库后，再在/head> 之前添加下面的JS代码，下面的代码便是获取Favicon图标的代码

script type="text/javascript">
///友情链接图标faviconjQuery(document).ready(function($){
$(".blogroll a").each(function(e){
    $(this).prepend("img src=http://www.google.com/s2/favicons?domain="+this.href.replace(/^(http:\/\/[^\/]+).*$/, '$1').replace( 'http://', '' )+" style=float:left;
    padding:5px;
    >
    ");
}
    );
}
    );
    /script>
    

具体含义就是：命令jQuery游历所有class=“blogroll”（修改为自己的class）下的a标签，然后在相对应a标签内添加img，src是GG服务器加对应a标签内的href主网址，并添加样式左浮动（即显示在左边）填充5px。

第三步：保存文件，刷新友情链接的页面，这时候我们就可以看到了友情链接网站的Favicon图标了。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！