Имя узла для выделенного текста в JavaScript
У меня есть HTML, который выглядит примерно так:
<span id="text">
<span class="segment" id="first">some text</span>
<span class="segment" id="sec">bla bla</span>
</span>
и когда пользователь выбирает что-то, я хочу определить, какие элементы он выбрал. Если, например, пользователь выбрал "text bl", мне нужны элементы "first" и "sec".
Для этого я попытался использовать endContainer.nodeName, но для каждого выделенного текста я получаю родительский элемент "текст". Возможно ли получить дочерние элементы?
var selObj = window.getSelection();
var selRange = selObj.getRangeAt(0);
if(selRange!="") {
var startName = selRange.startContainer.nodeName;
var endName = selRange.endContainer.nodeName;
alert(startName+" "+endName);
}
1 ответ
Решение
В вашем примере проблема заключается в том, что начальный и конечный узлы контейнера для выбора являются текстовыми узлами. Вы можете получить элементы контейнера, проверив nodeType
имущество:
var startNode = selRange.startContainer;
if (startNode.nodeType == 3) { // 3 is the node type for text nodes
startNode = startNode.parentNode;
}
... и аналогичный для конечного контейнера.