Определите, какие элементы DOM выбор текущего текста содержит
Я хочу смочь узнать, какие элементы DOM присутствуют в тексте, в настоящее время выбираемом пользователем в браузере.
document.getSelection () получил бы нас в настоящее время выделенный текст. Но как мы можем определить, какие элементы DOM содержатся в этом текстовом выборе?
1 ответ
window.getSelection () дает вам объект Selection . Используйте selection.rangeCount и selection.getRangeAt () , чтобы получить объект Range , представляющий, какой выбор вы хотите.
Теперь вы можете получить первый и последний узлы в выборе из range.startContainer / startOffset и range.endContainer / endOffset ]. Затем вы можете пройти вверх и вниз по дереву, чтобы подобрать все элементы между этими двумя позициями, например. используя функцию getElementsBetweenTree () из этого ответа .
К сожалению, модель IE TextRange полностью отличается от стандартов W3 и HTML5, и в целом намного хуже. Он не меняет начальную и конечную позиции почти так же легко и ненадежно. Все, что вы получаете, - это parentElement , чтобы указать общего предка, и оттуда вы можете угадать, где находится диапазон, создав новый диапазон и вызвав на нем moveToElementText , затем compareEndPoints с диапазоном выбора. И если вам нужно знать точный выделенный текст, вы затем угадываете на основе moveStart / moveEnd диапазона и сравнения, что совсем не весело.