揭秘Chrome 90 的文本选取分享功能：直击文字，分享精准内容

2023-09-13 22:22:16

在浏览器不断升级的过程中，用户对网络资源的获取与分享需求日益增长。Chrome 90 引入了新的文本选取分享功能，这一功能允许用户直接选择网页上的任何文字并轻松地将它们分享给他人或保存到本地设备。这种创新设计不仅提升了用户体验，还增强了内容的传播效率。

功能解析：如何工作

当用户在页面上选中一段文字时，浏览器会触发一个事件，这个事件可以被开发者捕获和利用。通过监听 selectionchange 事件，我们能够获取到用户当前选中的文本信息。这些信息随后可以通过各种渠道进行分享，比如复制粘贴、发送邮件或者直接通过社交媒体平台分发。

使用指南：如何实现

要在自己的网页上集成这个功能，首先需要检测用户的浏览器是否支持此功能，并且监听 selectionchange 事件来获取用户选中的文本内容。以下是简单的实现步骤：

检查浏览器兼容性。
监听页面上的文字选取变化。
获取并处理选中文字。

代码示例如下：

document.addEventListener('selectionchange', function() {
    var selection = window.getSelection();
    
    if(selection.type === "Text") {  // 确保只对文本选择做出响应
        console.log("用户选择了：", selection.toString());
        
        // 处理选中文本，如分享到社交媒体等
        shareContentToSocialMedia(selection.toString());
    }
});

function shareContentToSocialMedia(content) {
    // 模拟发送请求到社交媒体平台的逻辑
    fetch('https://api.example.com/share', {
        method: 'POST',
        headers: { "Content-Type": "application/json" },
        body: JSON.stringify({ content: content })
    }).then(response => console.log("分享成功"))
      .catch(error => console.error('分享失败：' + error));
}