HTML-элемент прикреплен к документу - PullRequest
Новая
       0

HTML-элемент прикреплен к документу

8 голосов
/ 13 апреля 2011

Когда элемент удаляется из DOM с помощью removeChild(), ссылка на элемент все еще существует, но элемента больше нет в DOM.
Как узнать, все еще ли HTML-элемент (или его родители) по-прежнемуприкреплен к документу?

Ответы [ 5 ]

12 голосов
/ 18 июня 2017

Node.prototype.contains() - это ответ: 

if(document.body.contains(yourElement)) {
    // Yep, it's attached.
}

Совместимость: IE5 +

10 голосов
/ 13 апреля 2011

Продолжайте проверять parentNode элемента, пока не доберетесь до документа или не исчерпаете узлы. 

function is_element_in_document ( element ) {
    if (element === document) {
        return true;
    }
    element = element.parentNode;
    if (element) {
        return is_element_in_document ( element );
    }
    return false;
}
7 голосов
/ 13 апреля 2011

Проверьте его parentNode свойство, если оно напрямую прикреплено к документу.Это null, если такого родительского элемента нет и в противном случае ссылка на родительский элемент.

Следующий код иллюстрирует его использование, он печатает null, [Object HTMLBodyElement] и null. 

var elm = document.createElement("p");
alert(elm.parentNode);

document.body.appendChild(elm);
alert(elm.parentNode);

elm.parentNode.removeChild(elm);
alert(elm.parentNode);

Обратите внимание, что это относится только к элементам, которые были удалены с помощью removeChild, если родительский элемент был удален, вам необходимо проверить свойство parentNode этого родительского элемента.

Чтобы выяснить, является ли элемент действительно частью документа, вам необходимо проверить, является ли самый верхний родительский элемент document. 

function element_is_part_of_document(element) {
    /* as long as the element is not document, and there is a parent element */
    while (element != document && element.parentNode) {
        /* jump to the parent element */
        element = element.parentNode;
    }
    /* at this stage, the parent is found. If null, the uppermost parent element */
    /* is not document, and therefore the element is not part of the document */
    return element == document;
}
.
6 голосов
/ 13 апреля 2011

С http://code.google.com/p/doctype-mirror/wiki/ArticleNodeContains:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script>
            function contains(parent, descendant) {
                return parent == descendant || Boolean(parent.compareDocumentPosition(descendant) & 16);
            }
            window.addEventListener("DOMContentLoaded", function() {
                var p = document.getElementById("test");
                //document.body.removeChild(p);
                alert(contains(document, p));
            }, false);
        </script>
    </head>
    <body>
        <p id="test">test</p>
    </body>
</html>

Я тестировал только в Opera.

На этой странице также есть альтернативы.

4 голосов
/ 25 августа 2018

Для более новых браузеров (без поддержки IE) вы можете использовать Node.isConnected, которое является свойством Node и возвращает логическое значение.

Mozilla Node.isConnected 

document.querySelectorAll('#myElement').isConnected;
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...