用JavaScript为cnblogs博客添加分享收藏功能

　　原理很简单，就是利用js提前文章标题和链接，然后分享收藏到各大网站。主要是利用博客后台的维护签名，把代码写在每一篇文章的底部。刚刚合适。O(∩_∩)O哈哈~

　　废话不多说，先看效果：

 

　　演示网址：http://www.cnblogs.com/atree/archive/2010/06/08/js-enter-event-input.html
　　JS代码展示：

 

document.writeln("<div class=\'SC\'>");
document.writeln("<font color=\'slateblue\'>分享收藏到：</font>");
document.writeln("<a href=\"JavaScript:d=document;t=d.selection?(d.selection.type!=\'None\'?d.selection.createRange().text:\'\'):(d.getSelection?d.getSelection():\'\');void(saveit=window.open(\'http://wz.csdn.net/storeit.aspx?t=\'+escape(d.title)+\'&u=\'+escape(d.location.href)+\'&c=\'+escape(t),\'saveit\',\'scrollbars=no,width=590,height=300,left=75,top=20,status=no,resizable=yes\'));saveit.focus();\" ><font color=\'crimson\'>CSDN</font></a>");
document.writeln("");
document.writeln("<a href=javascript:window.external.AddFavorite(location.href+\'#sc\',\'★\'+document.title)><font color=\'blue\'>IE</font></a>");
document.writeln("");
document.writeln("<a href=\"javascript:window.open(\'http://shuqian.qq.com/post?from=3&title=\'+encodeURIComponent(document.title)+\'&uri=\'+encodeURIComponent(document.location.href)+\'&jumpback=2&noui=1\',\'favit\',\'width=930,height=470,left=50,top=50,toolbar=no,menubar=no,location=no,scrollbars=yes,status=yes,resizable=yes\');void(0)\" ><font color=\'darkorange\'>QQ</font></a>");
document.writeln("");
document.writeln("<a href=\"javascript:window.open(\'http://cang.baidu.com/do/add?it=\'+encodeURIComponent(document.title.substring(0,76))+\'&iu=\'+encodeURIComponent(location.href)+\'&fr=ien#nw=1\',\'_blank\',\'scrollbars=no,width=600,height=450,left=75,top=20,status=no,resizable=yes\'); void 0\" ><font color=\'mediumblue\'>百度</font></a>");
document.writeln("");
document.writeln("<a href=\"javascript:q=(document.location.href);void(open(\'http://www.digbuzz.com/submit.php?url=\'+encodeURIComponent(q),\'\',\'\'));\"><font color=\'mediumpurple\'>我挖</font></a>");
document.writeln("");
document.writeln("<a href=\"javascript:window.open(\'http://www.google.com/bookmarks/mark?op=add&bkmk=\'+encodeURIComponent(location.href)+\'&title=\'+encodeURIComponent(document.title));void(0)\"><font color=\'darkblue\'>Google</font></a>");
document.writeln("");
document.writeln("<a href=\"javascript:d=document;t=d.selection?(d.selection.type!=\'None\'?d.selection.createRange().text:\'\'):(d.getSelection?d.getSelection():\'\');void(keyit=window.open(\'http://my.poco.cn/fav/storeIt.php?t=\'+escape(d.title)+\'&u=\'+escape(d.location.href)+\'&c=\'+escape(t)+\'&img=http://www.h-strong.com/blog/logo.gif\',\'keyit\',\'scrollbars=no,width=475,height=575,status=no,resizable=yes\'));keyit.focus();\" title=\"POCO网摘\"><font color=\'yellowgreen\'>POCO</font></a>");
document.writeln("");
document.writeln("<a href=\"javascript:window.open(\'http://myweb2.search.yahoo.com/myresults/bookmarklet?u=\'+encodeURIComponent(location.href)+\'&t=\'+encodeURIComponent(document.title));void(0)\" title=\"Yahoo书签\"><font color=\'red\'>Yahoo</font></a>");
document.writeln("");
document.writeln("<a href=\"javascript:d=document;t=d.selection?(d.selection.type!=\'None\'?d.selection.createRange().text:\'\'):(d.getSelection?d.getSelection():\'\');void(vivi=window.open(\'http://vivi.sina.com.cn/collect/icollect.php?pid=28&title=\'+escape(d.title)+\'&url=\'+escape(d.location.href)+\'&desc=\'+escape(t),\'vivi\',\'scrollbars=no,width=480,height=480,left=75,top=20,status=no,resizable=yes\'));vivi.focus();\" title=\"新浪ViVi\"><font color=\'orangered\'>新浪</font></a>");
document.writeln("");
document.writeln("<a href=\"javascript:d=document;t=d.selection?(d.selection.type!=\'None\'?d.selection.createRange().text:\'\'):(d.getSelection?d.getSelection():\'\');void(keyit=window.open(\'http://www.365key.com/storeit.aspx?t=\'+escape(d.title)+\'&u=\'+escape(d.location.href)+\'&c=\'+escape(t),\'keyit\',\'scrollbars=no,width=475,height=575,left=75,top=20,status=no,resizable=yes\'));keyit.focus();\" title=\"365Key网摘\"><font color=\'chartreuse\'>365Key</font></a>");
document.writeln("");
document.writeln("<a href=\"javascript:d=document;t=d.selection?(d.selection.type!=\'None\'?d.selection.createRange().text:\'\'):(d.getSelection?d.getSelection():\'\');void(yesky=window.open(\'http://hot.yesky.com/dp.aspx?t=\'+escape(d.title)+\'&u=\'+escape(d.location.href)+\'&c=\'+escape(t)+\'&st=2\',\'yesky\',\'scrollbars=no,width=400,height=480,left=75,top=20,status=no,resizable=yes\'));yesky.focus();\" title=\"天极网摘\"><font color=\'goldenrod\'>天极</font></a>");
document.writeln("");
document.writeln("<A href=\"javascript:t=document.title;u=location.href;e=document.selection?(document.selection.type!=\'None\'?document.selection.createRange().text:\'\'):(document.getSelection?document.getSelection():\'\');void(open(\'http://bookmark.hexun.com/post.aspx?title=\'+escape(t)+\'&url=\'+escape(u)+\'&excerpt=\'+escape(e),\'HexunBookmark\',\'scrollbars=no,width=600,height=450,left=80,top=80,status=no,resizable=yes\'));\" title=\"和讯网摘\"><font color=\'cornflowerblue\'>和讯</font></A>");
document.writeln("");
document.writeln("<a href=\"javascript:d=document;t=d.selection?(d.selection.type!=\'None\'?d.selection.createRange().text:\'\'):(d.getSelection?d.getSelection():\'\');void(blog=window.open(\'http://www5.bolaa.com/CommendBlog/SmallLogin.aspx?title=\'+escape(d.title)+\'&newspath=\'+escape(d.location.href)+\'&subtitle=\'+escape(t),\'bolaa\',\'width=400px,height=400px\'));blog.focus();\"><font color=\'lightsteelblue\'>博拉</font></a>");
document.writeln("");
document.writeln("<a href=\"javascript:d=document;t=d.selection?(d.selection.type!=\'None\'?d.selection.createRange().text:\'\'):(d.getSelection?d.getSelection():\'\');void(live=window.open(\'https://favorites.live.com/quickadd.aspx?marklet=1&mkt=en-us&url=\'+escape(d.location.href)+\'&title=\'+escape(d.title)+\'&top=1\',\'live\',\'scrollbars=no,status=no,resizable=yes\'));live.focus();\"><font color=\'limegreen\'>Live</font></a>");
document.writeln("");
document.writeln("<a title=\"推荐到diglog\" href=\"javascript://\" onclick=\"javascript:d=document;t=d.selection?(d.selection.type!=\'None\'?d.selection.createRange().text:\'\'):(d.getSelection?d.getSelection():\'\');void(keyit=window.open(\'http://www.diglog.com/submit.aspx?title=\'+escape(d.title)+\'&url=\'+escape(d.location.href)+\'&description=\'+escape(t),\'keyit\',\'resizable,location,menubar,toolbar,scrollbars,status\'));keyit.focus();\"><font color=\'indianred\'>奇客</font></a>");
document.writeln("");
document.writeln("<a href=\"javascript:window.open(\'http://www.xianguo.com/service/submitfav/?link=\'+encodeURIComponent(location.href)+\'&title=\'+encodeURIComponent(document.title));void(0)\"><font color=\'yellowgreen\'>鲜果</font></a>");
document.writeln("");
document.writeln("<a target=\"_blank\" href=\"http://www.shouker.com/\" onClick=\"javascript:var js=document.createElement(\'script\');if(typeof(js)!=\'object\')js=document.standardCreateElement(\'script\');js.type=\'text/javascript\';js.src=\'http://www.shouker.com/js/capageb.js\';document.getElementsByTagName(\'html\')[0].appendChild(js);return false;\"><font color=\'firebrick\'>收客</font></a>");
document.writeln("");
document.writeln("<a href=\"javascript:var d=document,w=window,f=\'http://fanfou.com/share\',l=d.location,e=encodeURIComponent,p=\'?u=\'+e(l.href)+\'&t=\'+e(d.title)+\'&d=\'+e(w.getSelection?w.getSelection().toString():d.getSelection?d.getSelection():d.selection.createRange().text)+\'&s=bm\';a=function(){if(!w.open(f+\'r\'+p,\'sharer\',\'toolbar=0,status=0,resizable=0,width=600,height=400\'))l.href=f+\'.new\'+p};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else{a()}void(0)\"><font color=\'darksalmon\'>饭否</font></a>");
document.writeln("");
document.writeln("<a href=\"javascript:var d=document,w=window,f=\'http://jiwai.de/wo/share/s\',l=d.location,e=encodeURIComponent,p=\'?u=\'+e(l.href)+\'&t=\'+e(d.title)+\'&d=\'+e(w.getSelection?w.getSelection().toString():d.getSelection?d.getSelection():d.selection.createRange().text);a=function(){if(!w.open(f+p,\'sharer\',\'toolbar=0,status=0,resizable=0,width=540,height=310\'))l.href=f+\'.new\'+p};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else{a()}void(0)\"><font color=\'dodgerblue\'>叽歪</font></a>");
document.writeln("");
document.writeln("<a href=\"javascript:q=(document.location.href);void(open(\'http://www.waakee.com/submit.php?url=\'+encodeURIComponent(q),\'\',\'\'));\"><font color=\'slateblue\'>挖客</font></a>");
document.writeln("");
document.writeln("</div> ");

 

 

 

　　JS的介绍：

　　将代码全部复制到签名中，会出现错误，因为字太多了。所以要将代码写到share.js文件中，放到其他地方。然后引用进来。用document.writeln输出。在输出的时候，如果出现中文乱码。那么请看utf-8编码引起document.writeln输出中文乱码的解决办法。其他代码就不多说了。

　　引用代码（放在签名中）：

 

<script charset="GB2312" src="http://www.yourname.com/javascript/share.js" type="text/javascript" />

 

 

 

　　我的CSS样式（放到设置-通过CSS定制页面风格中）：

 

 

.SC{margin-top:15px;margin-bottom:15px;line-height:25px;border:1px dashed  #6A9BFA;padding-left:5px;padding-right:5px;text-align:center;}
.SC img{margin-left:6px;}

 

 

　　至此，就差不多了，觉得不好看，还可以自己调整。想要多漂亮就有多漂亮。我最喜欢博客园为我们提供了那么多可以展现个性化的借口。感谢博客园的同志们！

 

　　本文地址：http://www.cnblogs.com/atree/archive/2010/06/22/JavaScript-bookmark-share.html

　　相关文档：锦上添花,为博客加上漂亮的顶部工具导航条