JavaScript Range.startContainer — вузол, де починається діапазон
Властивість startContainer повертає вузол, у якому починається діапазон.
Загальний опис
Найчастіше це текстовий вузол, а не елемент — бо виділення зазвичай починається посеред тексту. Тому звертатись до його classList чи tagName не можна, доведеться спершу піднятись до parentElement.
Переглядачі
| Переглядач |  |
 |
 |
 |
 |
 |
|---|---|---|---|---|---|---|
| startContainer | 1+ | 1+ | 1+ | 7+ | 12+ | 9+ |
| Переглядач |  |
 |
 |
 |
|---|---|---|---|---|
| startContainer | yes | yes | yes | yes |
Приклади
+ запропонувати свій приклад у пісочниці
Знайти елемент, у якому почалося виділення.
HTML
<p id="editor">Текст із виділенням</p>JS
// у демо виділення створюємо самі; вручну виділи текст і спробуй ще раз
const initialRange = document.createRange();
initialRange.selectNodeContents(document.getElementById('editor').firstChild);
window.getSelection().removeAllRanges();
window.getSelection().addRange(initialRange);
const range = window.getSelection().getRangeAt(0);
console.log(range.startContainer.nodeType); // 3 — текстовий вузол
console.log(range.startOffset); // номер символу
// щоб дістати ЕЛЕМЕНТ — піднімаємось
const element = range.startContainer.nodeType === 3
? range.startContainer.parentElement
: range.startContainer;
console.log(element.tagName); // 'P'Коментарі
Коментарів ще немає — будьте першим!