Javascript 如何在Google blogger blog中创建共享按钮以与帖子URL共享报价

Javascript 如何在Google blogger blog中创建共享按钮以与帖子URL共享报价,javascript,share,blogger,android-sharing,Javascript,Share,Blogger,Android Sharing,我想制作一个共享按钮来共享我的博客的引用 比如说 <blockquote>"Imagination is more important than knowledge." --Albert Einstein</blockquote> <share_button> <blockquote>"Life is a preparation for the future; and the best preparation for the future is

我想制作一个共享按钮来共享我的博客的引用

比如说

<blockquote>"Imagination is more important than knowledge."
--Albert Einstein</blockquote>
<share_button>

<blockquote>"Life is a preparation for the future; and the best preparation for the future is to live as if there were none."
--Albert Einstein</blockquote>
<share_button>
“想象力比知识更重要。”
--爱因斯坦
“生活是对未来的准备;而对未来最好的准备就是像没有未来一样生活。”
--爱因斯坦
当访问者单击任何报价的共享按钮时,使用默认Android的共享应用程序列表,可以根据访问者选择将相关报价与post URL共享到任何应用程序

编辑:-我的博客只基于引用主题。每个帖子都有很多引用,我想在每个引用之后使用一个共享按钮,这样人们就可以共享他们想要的任何引用。 如何做到这一点而不为每个按钮和引号创建唯一的ID

<blockquote>"Imagination is more important than knowledge."
--Albert Einstein</blockquote>
<button class="shareBtn">Share Blockquote</button>

<blockquote>"Life is a preparation for the future and the best preparation for the future is to live as if there were none."
--Albert Einstein</blockquote>
<button class="shareBtn">Share Blockquote</button>

  <blockquote>"Remember not only to say the right thing in the right place, but far more difficult still, to leave unsaid the wrong thing at the tempting moment."
--Benjamin Franklin</blockquote>
<button class="shareBtn">Share Blockquote</button>


  <blockquote>"You don't have to hold a position in order to be a leader."
--Henry Ford</blockquote>
<button class="shareBtn">Share Blockquote</button>
“想象力比知识更重要。”
--爱因斯坦
股票大宗报价
“生活是对未来的准备,对未来最好的准备就是像没有未来一样生活。”
--爱因斯坦
股票大宗报价
“记住,不仅要在正确的地方说正确的话,而且更难的是,在诱人的时刻不说错误的话。”
--本杰明·富兰克林
股票大宗报价
“要成为领导者,你不必非得担任某个职位。”
--亨利福特
股票大宗报价
您可以使用


您的解决方案仅适用于一个报价或第一个按钮。我想对每个按钮使用“类”而不是“id”。编辑问题谢谢@Bassam的帮助。它的工作只是在行文档中做一个小的更正。querySelectorAll('shareBtn')在shareBtnCode之前应用一个点(.),只有当我在帖子中添加它时,它才起作用。但如果在标记之前添加主题,则不起作用。请检查此url,因为JavaScript代码在页面上呈现blockquote元素之前执行。它应该在元素之后。为什么不将代码放在前面,而不是为了获得最佳性能!
<button id="shareBtn">Share Blockquote</button>

<script>
//<![CDATA[
var shareButton = document.getElementById('shareBtn');
var title = document.title;
var text = document.querySelector('blockquote').textContent;
var url = window.location.href;

shareButton.addEventListener('click', function () {
    if (navigator.share) {
        navigator.share({
            title: title,
            text: text,
            url: url
        });
    }
});
//]]>
</script>
<script>
//<![CDATA[
var title = document.title;
var url = window.location.href;

document.querySelectorAll('.shareBtn').forEach(function (btn) {
    var text = btn.previousElementSibling.textContent;
    btn.addEventListener('click', function () {
        if (navigator.share) {
            navigator.share({
                title: title,
                text: text,
                url: url
            });
        }
    });
});
//]]>
</script>