1.主要实现通过前端在页面中实现分享功能。依赖了一段nativeShare.js文件。（我放在文章最后面，直接复制就可）

参考了他人写法，我自己修改了页面效果，现在更简洁。大家如果使用直接复制我的nativeShare.js就可以无需修改。

2.使用方法。

html中写一个标签： 分享按钮；

more是我的按钮样式无所谓。必须要有自定义属性data-app=" ";括号中的nativeShare是id，大家自己命名就可以。

js中写一句话即可： var share_obj = new nativeShare('nativeShare',config);

然后你就可以愉快的使用分享到微信、qq、新浪等功能了。

3.这个nativeShare.js 目前只是支持UC浏览器和QQ浏览器。功能还是不够令人满意，

所以实际网站中如果是其他浏览器建议可以js代码判断浏览器类型；隐藏这个分享按钮。这样用户体验好。

4.截图是我的实际已经上线的测试网站，必须复制链接才能访问。"http://shoujibao.net/news/publish/wap/pzx/wapstation/testwx/index.jsp"

    H5分享功能测试

        .more{

            margin:10px auto;           

            width:100px;

            height:30px;

            border-radius: 5px;

            background: linear-gradient(to right,rgb(240, 185, 185) 0%,rgb(77, 106, 235) 100%);

            line-height:30px;

            text-align: center;

        }

        .bg{

            position:fixed;

            left:0;

            right:0;

            top:0;

            bottom: 0;

            background: url('./icon/chigua.jpg');

            background-size: cover;

        }

        .content{

            padding:10px;

            color:rgb(197, 28, 240);

            /* font-style: oblique; */

            line-height: 40px;

            text-shadow: 3px 3px 2px rgb(240, 242, 243);

            font-size:18px;

            font-weight:600;

            font-family: Arial, Helvetica, sans-serif;

        }

         分享

            你好阳光

 忽然之间，太阳再也藏不住了，它举着自己庞大的脸颊从东边射出千万光芒，一切都染上了红彤彤的颜色，没过多久，火球般的红日，

                从东方平线上缓缓的升起了顿时远处的树林，

                地上的花草青青的山，绿绿的水，都披上了彩衣。充满了朝气，尤其是枝叶上的露珠，尤如钻石一般，格外的耀眼，格外的纯洁，格外的迷人。

        var config = {

            url:window.location.href,

            title:document.title,

            desc:'你好阳光',

            img:'http://shoujibao.net/news/publish/wap/resource/share/v7/img/zd4.png',

            img_title:'分享',

            from:'来自AILIHEIHEI'

        };

        var share_obj = new nativeShare('nativeShare',config);

nativeShare.js代码如下：

/**

 * Created by Jeffery Wang.

 * Create Time: 2015-06-16 19:52

     修改：AILIHEIHEI:2020-6-15

 * Author Link: http://blog.wangjunfeng.com

 */

var nativeShare = function (elementNode, config) {

    if (!document.getElementById(elementNode)) {

        return false;

    }

    var qApiSrc = {

        lower: "http://3gimg.qq.com/html5/js/qb.js",

        higher: "http://jsapi.qq.com/get?api=app.share"

    };

    var bLevel = {

        qq: {forbid: 0, lower: 1, higher: 2},

        uc: {forbid: 0, allow: 1}

    };

    //查看浏览器版本信息

    var UA = navigator.appVersion;

    console.log(UA,'hhhhhhhh',navigator.userAgent);// 区分高低版本QQ浏览器     2:higher 或者  0:forbid

    var isqqBrowser = (UA.split("MQQBrowser/").length > 1) ? bLevel.qq.higher : bLevel.qq.forbid;

                                                            // 1:allow    或者  0:forbid

    var isucBrowser = (UA.split("UCBrowser/").length > 1) ? bLevel.uc.allow : bLevel.uc.forbid;

    var version = {

        uc: "",

        qq: ""

    };

    var isWeixin = false;

    config = config || {};

    this.elementNode = elementNode;

    this.url = config.url || document.location.href || '';

    this.title = config.title || document.title || '';

    this.desc = config.desc || document.title || '';

    this.img = config.img || document.getElementsByTagName('img').length > 0 && document.getElementsByTagName('img')[0].src || '';

    this.img_title = config.img_title || document.title || '';

    this.from = config.from || window.location.host || '';

    this.ucAppList = {

        sinaWeibo: ['kSinaWeibo', 'SinaWeibo', 11, '新浪微博'],

        weixin: ['kWeixin', 'WechatFriends', 1, '微信好友'],

        weixinFriend: ['kWeixinFriend', 'WechatTimeline', '8', '微信朋友圈'],

        QQ: ['kQQ', 'QQ', '4', 'QQ好友'],

        QZone: ['kQZone', 'QZone', '3', 'QQ空间']

    };

    this.share = function (to_app) {

        var title = this.title, url = this.url, desc = this.desc, img = this.img, img_title = this.img_title, from = this.from;

        //如果是UC浏览器

        if (isucBrowser) {

            to_app = to_app == '' ? '' : (platform_os == 'iPhone' ? this.ucAppList[to_app][0] : this.ucAppList[to_app][1]);

            if (to_app == 'QZone') {

                B = "mqqapi://share/to_qzone?src_type=web&version=1&file_type=news&req_type=1&image_url="+img+"&title="+title+"&description="+desc+"&url="+url+"&app_name="+from;

                k = document.createElement("div"), k.style.visibility = "hidden", k.innerHTML = '', document.body.appendChild(k), setTimeout(function () {

                    k && k.parentNode && k.parentNode.removeChild(k)

                }, 5E3);

            }

            //UC自带的api，调用即可

            if (typeof(ucweb) != "undefined") {

                ucweb.startRequest("shell.page_share", [title, title, url, to_app, "", "@" + from, ""])

            } else {

                if (typeof(ucbrowser) != "undefined") {

                    ucbrowser.web_share(title, title, url, to_app, "", "@" + from, '')

                } else {

                }

            }

        } else {

            if (isqqBrowser && !isWeixin) {

                to_app = to_app == '' ? '' : this.ucAppList[to_app][2];

                var ah = {

                    url: url,

                    title: title,

                    description: desc,

                    img_url: img,

                    img_title: img_title,

                    to_app: to_app,//微信好友1,腾讯微博2,QQ空间3,QQ好友4,生成二维码7,微信朋友圈8,啾啾分享9,复制网址10,分享到微博11,创意分享13

                    cus_txt: "请输入此时此刻想要分享的内容"

                };

                ah = to_app == '' ? '' : ah;

                if (typeof(browser) != "undefined") {

                    if (typeof(browser.app) != "undefined" && isqqBrowser == bLevel.qq.higher) {

                        browser.app.share(ah)

                    }

                } else {

                    if (typeof(window.qb) != "undefined" && isqqBrowser == bLevel.qq.lower) {

                        window.qb.share(ah)

                    } else {

                    }

                }

            } else {

            }

        }

    };

    // this.html = function() {

    //     var position = document.getElementById(this.elementNode);

    //     var html = '分享到'+

    //         ''+

    //         '新浪微博'+

    //         '微信好友'+

    //         '微信朋友圈'+

    //         'QQ好友'+

    //         'QQ空间'+

    //         '更多'+

    //         '';

    //     position.innerHTML = html;

    // };

    this.isloadqqApi = function () {

        if (isqqBrowser) {

            var b = (version.qq 

            return "iPhone"

        }

        return "Android"

    };

    this.is_weixin = function () {

        var a = UA.toLowerCase();

        if (a.match(/MicroMessenger/i) == "micromessenger") {

            return true

        } else {

            return false

        }

    };

    this.getVersion = function (c) {

        var a = c.split("."), b = parseFloat(a[0] + "." + a[1]);

        return b

    };

    this.init = function () {

        platform_os = this.getPlantform();

        version.qq = isqqBrowser ? this.getVersion(UA.split("MQQBrowser/")[1]) : 0;

        version.uc = isucBrowser ? this.getVersion(UA.split("UCBrowser/")[1]) : 0;

        isWeixin = this.is_weixin();

        if ((isqqBrowser && version.qq 

            if (isqqBrowser && version.qq 

                if (isucBrowser && ((version.uc 

        //     this.html();

        // } else {

        //     document.write('目前该分享插件仅支持手机UC浏览器和QQ浏览器');

        // }

    };

    this.init();

    var share = this;

    var items = document.getElementById(elementNode);

    items.οnclick=function(){

        share.share(this.getAttribute('data-app'))

    }

    // for (var i=0;i

    //         share.share(this.getAttribute('data-app'));

    //     }

    // }

    return this;

};