返回共享按钮的当前 URL答案

【问题标题】：Return current URL for a share button返回共享按钮的当前 URL
【发布时间】：2021-01-15 07:59:02
【问题描述】：

我是 Web 开发新手，我正在尝试使用 JS 将当前 URL 插入到 Facebook 分享按钮的 href 中。我尝试了以下方式，但您可以看到它不正确。

function getURL() {
    return window.location.href;
}

<div class="fb-share-button" 
    data-href="https://www.facebook.com" 
    data-layout="button" 
    data-size="small">
      <a target="_blank" 
        href="getURL()" 
        class="fb-xfbml-parse-ignore">
        Share
      </a>
</div>

【问题讨论】：

你的意思是点击分享按钮会移动Facebook分享页面？？
这能回答你的问题吗？ How to add facebook share button on my website?

标签： javascript html url href share-button

【解决方案1】：

试试这个

<script>
    document.querySelector('a').setAttribute("href",  window.location.href);
</script>


<div class="fb-share-button" data-href="https://www.facebook.com" data-layout="button" data-size="small"><a target="_blank" href="" class="fb-xfbml-parse-ignore" id='facebook-share'>Share</a></div>

【讨论】：

通过id(document.getElementById('facebook-share') )选择a元素会更安全

【解决方案2】：

在您的标签<a> 中添加id

<div class="fb-share-button" data-layout="button" data-size="small"><a target="_blank" id="btnsharefb" class="fb-xfbml-parse-ignore">Share</a></div>

并创建监听器以事件点击您的标签a

document.getElementById("btnsharefb").addEventListener("click", function() {
  this.href = getURL();
});

或直接在加载文档上添加

document.getElementById("btnsharefb").href = getURL();

例如https://codepen.io/darlandieterich/pen/abNrmWO

【讨论】：