如何使用 JavaScript 返回共享按钮的当前 URL？

在网站设计中，经常需要实现一些社交网络共享按钮的功能。为了达到这个目的，我们需要获取当前网页的URL，以便将URL与标题和其他元素一起传递给社交网络平台。在这篇文章中，我们将介绍如何使用 JavaScript 返回共享按钮的当前 URL。

获取当前URL

要获取当前网页的URL，我们可以使用 window.location 对象。该对象包含了当前页面的URL地址。

以下是获取当前URL的代码示例：

var currentUrl = window.location.href;

将URL传递给共享按钮

一旦获取了当前URL，我们就可以将其与其他元素一起传递给共享按钮。

假设我们有一个共享按钮，当用户点击该按钮时，我们想要打开 Twitter 共享对话框并传递当前URL。以下是一个使用 JavaScript 实现的示例：

var currentUrl = window.location.href;

document.querySelector('.share-button').addEventListener('click', function() {
  var shareUrl = 'https://twitter.com/intent/tweet?text=Check%20out%20this%20article:&url=' + currentUrl;
  window.open(shareUrl);
});

在上面的代码中，我们首先获取当前URL，并将其存储在变量 currentUrl 中。

接着，我们选择共享按钮，并为其添加一个点击事件监听器。

在点击事件发生时，我们构建了一个分享URL，其中包含当前URL。我们使用 window.open() 方法打开该 URL，它会在新窗口或选项卡中打开 Twitter 共享对话框。

总结

在本文中，我们介绍了如何使用 JavaScript 返回共享按钮的当前 URL。我们使用 window.location 对象获取了当前页面的 URL 地址，并将其传递给共享按钮，以便将其分享到社交网络上。