Question

让我们假设我有一些像这样的HTML：

  <div id='fooBar' contenteditable='true'>Hello <span class="test">World</span></div>

Javascript代码：

var fooBar = document.getElementById('fooBar');

fooBar.addEventListener('click', function() {
    console.log(window.getSelection().getRangeAt(0).commonAncestorContainer)
});

问题：为什么它不会得到名为test的实际容器？我无法弄清楚为什么这不起作用。我甚至用selection.anchorNode.parentElement尝试了它。什么都行不通。现在，当我从window.getSelection（）查看对象的内部体系结构时，我不会将span元素列为属性。我做错了什么？

https://jsfiddle.net/w7bfmLqd/1/

Answer 1

我已成功使用此功能：

var fooBar = document.getElementById('fooBar');

fooBar.addEventListener('click', function() {
    console.log(window.getSelection().focusNode.parentElement);
});

https://jsfiddle.net/w7bfmLqd/2/

无法获得所选文本的容器（可用jsfiddle）

1 个答案: