JavaScript Range.selectNodeContents() — діапазон навколо вмісту

Метод selectNodeContents() охоплює вміст вузла, не чіпаючи сам теґ.

правити

Загальний опис

Найпростіший спосіб виділити весь текст блоку програмно: зробити діапазон по його вмісту й віддати його Selection.

Саме так працює кнопка «виділити весь код» у блоках коду на сайтах.

правити

Порада

Для копіювання в буфер сьогодні простіше navigator.clipboard.writeText() — виділяти нічого не треба взагалі.

автор: NagarD правити

+ додати пораду чи нотатку

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
selectNodeContents	1+	1+	1+	7+	12+	9+

Підтримка: мобільні переглядачі

Переглядач
selectNodeContents	yes	yes	yes	yes

Приклади

+ запропонувати свій приклад у пісочниці

<pre id="code">const x = 1;</pre>
<button id="select">Виділити</button>

document.getElementById('select').addEventListener('click', () => {
    const range = document.createRange();
    range.selectNodeContents(document.getElementById('code'));

    const selection = window.getSelection();
    selection.removeAllRanges();
    selection.addRange(range);
});