JavaScript isConnected — чи вузол у документі

Властивість isConnected каже, чи вузол досі є в документі: true або false.

правити

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

Видалений зі сторінки вузол не зникає — він живе в пам'яті, доки на нього хтось посилається. Тому асинхронний код цілком може дописати щось в елемент, якого на сторінці вже немає: запит повернувся, а користувач за цей час перейшов на іншу сторінку.

isConnected — найкоротший спосіб це помітити й нічого не робити даремно.

Раніше те саме писали як document.contains(node) — довше й менш очевидно.

правити

Порада

Після кожного await у коді, що чіпає DOM, варто перевірити element.isConnected — за час запиту елемент могли прибрати.

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

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

Переглядачі

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

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

Переглядач
isConnected	51+	49+	10+	38+	79+	-

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

Переглядач
isConnected	51+	yes	yes	10+

Приклади

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

async function load(element) {
    const data = await fetch('/api/data').then(r => r.json());

    // за час запиту елемент могли прибрати зі сторінки
    if (!element.isConnected) {
        return;
    }

    element.textContent = data.title;
}

const node = document.createElement('div');
console.log(node.isConnected); // false — ще не в документі

document.body.append(node);
console.log(node.isConnected); // true