Heim > Artikel > Web-Frontend > Javascript-Methode zur Implementierung von Baidu-Sharing-Funktionen_Javascript-Fähigkeiten
Das Beispiel in diesem Artikel beschreibt die Methode zur Verwendung von JavaScript zur Implementierung von Sharing-Funktionen ähnlich wie bei Baidu. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:
Tencent und Kaixin Community bieten diese Art von Sharing-Schnittstelle. Die Nutzung der Baidu-Sharing-Funktion ist sehr einfach
Im Allgemeinen müssen Websites auf die Freigabefunktion zugreifen und diese Codes hinzufügen, aber die Anpassung ist nicht sehr gut. Der Stil der Freigabefunktion ist einfach und erfordert nicht zu viel JS-Code. Dadurch wird die Ladegeschwindigkeit der Webseite erheblich verbessert.
Der Betriebseffekt ist wie folgt:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>网络分享代码分享</title> <style type="text/css"> /** * 分享代码样式 * by kily */ #ak_share { padding:10px 0; font-size:12px; } .ak_share { height:1%; overflow:hidden; } .ak_share dt { float:left; font-weight:bold; color:#A5A5A5; height:16px; line-height:16px; } .ak_share dd { margin-right:10px; margin-left:0; height:16px; float:left; } .ak_share a:hover { color:#ed7811; text-decoration:underline;} .ak_share a { float:left; height:16px; line-height:16px; padding-left:18px; background:url(http://www.yem120.com/images/share.gif) left top no-repeat; color:#666; text-decoration:none; } .ak_share .t_163_s { background-position: 0 -16px; } .ak_share .t_qq_s { background-position: 0 -32px; } .ak_share .qzone_s { background-position: 0 -48px; } .ak_share .douban_s { background-position: 0 -64px; } </style> </head> <body> <div id="ak_share"> <dl class="ak_share"> <dt>分享:</dt> <dd> <a class="t_sina_s" href="javascript:(function(){window.open('http://v.t.sina.com.cn/share/share.php?title='+encodeURIComponent(document.title)+'&url='+encodeURIComponent(location.href)+'&source=bookmark','_blank','width=450,height=400');})()" title="分享到新浪微博" rel="nofollow">新浪微博</a> </dd> <dd> <a class="t_163_s" href="javascript:(function(){window.open('http://t.163.com/article/user /checkLogin.do?link=http://news.163.com/&source=' + '&info='+encodeURIComponent(document.title)+' '+encodeURIComponent(location.href),'_blank','width=510,height=300');})()" title="分享到网易微博" rel="nofollow">网易微博</a> </dd> <dd> <a class="t_qq_s" href="javascript:(function(){window.open('http://v.t.qq.com/share/share.php?title='+encodeURIComponent(document.title)+'&url='+encodeURIComponent(location.href)+'&source=bookmark','_blank','width=610,height=350');})()" title="分享到腾讯微博" rel="nofollow">腾讯微博</a> </dd> <dd> <a class="qzone_s" href="javascript:void(window.open('http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url='+encodeURIComponent(document.location.href)));" title="分享到QQ空间" rel="nofollow">QQ空间</a> </dd> <dd> <a class="douban_s" href="javascript:void(function(){var%20d=document,e=encodeURIComponent,s1=window.getSelection,s2=d.getSelection,s3=d.selection,s=s1?s1():s2?s2():s3?s3.createRange().text:' ',r='http://www.douban.com/recommend/?url='+e(d.location.href)+'&title='+e(d.title)+'&sel='+e(s)+'&v=1',x=function(){if(!window.open(r,'douban','toolbar=0,resizable=1,scrollbars=yes,status=1,width=450,height=330'))location.href=r+'&r=1'};if(/firefox/.test(navigator.userAgent)){setTimeout(x,0)}else{x()}})()" title="推荐到豆瓣" rel="nofollow">豆瓣</a> </dd> </dl> </div> </body> </html>
Ich hoffe, dass dieser Artikel für das JavaScript-Programmierdesign aller hilfreich sein wird.