使用百度分享api实现网页分享功能

版权声明: https://blog.csdn.net/weixin_41187842/article/details/81502700

百度官方文档:http://share.baidu.com/code/advance#toid

首先先引入外部文件:

with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?cdnversion='+~(-new Date()/36e5)];

这段代码会自动加载一段js与css。

然后你需要有dom树,

<div class="bdsharebuttonbox" data-tag="share_1">
	<a class="bds_mshare" data-cmd="mshare"></a>
	<a class="bds_qzone" data-cmd="qzone" href="#"></a>
	<a class="bds_tsina" data-cmd="tsina"></a>
	<a class="bds_baidu" data-cmd="baidu"></a>
	<a class="bds_renren" data-cmd="renren"></a>
	<a class="bds_tqq" data-cmd="tqq"></a>
	<a class="bds_more" data-cmd="more">更多</a>
	<a class="bds_count" data-cmd="count"></a>
</div>

这里的a标签不用写地址。

然后我们实现一个简易的分享功能:

window._bd_share_config = {
                  "common" : {
                   "bdText" : '这是分享的标题',
                   "bdComment" : '我是通用分享设置,会出现在发送给QQ好友里的描述',
                   "bdPic" : "http://test.miniwangdai.com/public/images/invite/wechat.png",//分享的图像地址
                   "bdStyle" : "0",//按钮样式
                   "bdSize" : "32",//按钮大小
                   "bdUrl" : 'https://www.baidu.com',//分享的地址
                   "bdDesc":'给你的好友留一句话吧',
                  },
                  "share" : {},
                };

这样最简单的分享功能就做好了。

效果:

 

猜你喜欢

转载自blog.csdn.net/weixin_41187842/article/details/81502700