Javascript 单击后可以从字符串中获取一个符号吗？

我有一个DOM文档，其文本内容如下：

<p>Content scripts aren't completely cut off from their parent extensions. A content script can exchange messages with its parent extension</p>

---

这是一个相当简单的模式，当你想对单个字符进行操作，但是你有段落或单词块中的数据。要做的第一件事是遍历所有段落，如下所示：

var paras = document.querySelectorAll('p');
for (var i = 0; i < paras.length; i++) {
    var para = paras[i];

    var text = para.textContent;
    var split = para.split('');
    var newText = '';
    for (var j = 0; j < split.length; j++) {
        newText += '<span class="char">' + split[j] + '</span>';
    }

    para.innerHTML = newText;
}

与Selection.focusNode相比，此方法的一个可能优势在于，它还允许将单个字符作为元素进行修改，而不仅仅是确定

---

请注意，这将破坏事件和对象引用——如果需要持久化这些事件和对象引用，请使用jQuery的

replaceWith

之类的工具，并在文本节点上进行迭代。

不清楚询问的是什么……据我所知，@douglasdaseco可能重复，OP想知道用户单击的文本节点中的哪个字符。链接的答案正是如此。无论如何，我期待着看到您更快、更便携的解决方案。重复。。。此处回答：此代码可断开多字节字符。

var paras = document.querySelectorAll('p');
for (var i = 0; i < paras.length; i++) {
    var para = paras[i];

    var text = para.textContent;
    var split = para.split('');
    var newText = '';
    for (var j = 0; j < split.length; j++) {
        newText += '<span class="char">' + split[j] + '</span>';
    }

    para.innerHTML = newText;
}

 document.body.addEventListener('click', function(e) {
     if (e.target.classList.contains('char')) {
          console.log(e.clientLeft, e.clientTop);
     }
 });