Question

如果我获取了HTML doc的所有元素并将它们存储在一个数组中。现在假设我使用jquery remove（）方法删除了一些元素。我知道它也会删除它的子孩子。现在我想遍历列表并想知道哪些子元素也被删除了。看看这段代码： -

$(document).ready(function() {
        var list = $('*');
        for (var i=0; i<list.length; i++) {
            console.log(i + " " + list[i].tagName);
        }
        $("table").remove();
        for (var i=0; i<list.length; i++) {
            if ($(list[i]).parent().length == 0) console.log(list[i].tagName + "does not exist in dom now");
            else console.log(i + " " + list[i].tagName + " " + $(list[i]).parent().get(0).tagName);
        }
    });

HTML部分是： -

<div>
    <table>
        <tr>
            <td> Hi this is Sachin </td>
            <td> Hi this is Rahul </td>
        </tr>
    </table>
</div>

我收到的输出是：_

0 HTML parent.html:9
1 HEAD parent.html:9
2 SCRIPT parent.html:9
3 SCRIPT parent.html:9
4 BODY parent.html:9
5 DIV parent.html:9
6 TABLE parent.html:9
7 TBODY parent.html:9
8 TR parent.html:9
9 TD parent.html:9
10 TD parent.html:9
0 HTML undefined parent.html:14
1 HEAD HTML parent.html:14
2 SCRIPT HEAD parent.html:14
3 SCRIPT HEAD parent.html:14
4 BODY HTML parent.html:14
5 DIV BODY parent.html:14
TABLEdoes not exist in dom now parent.html:13
7 TBODY TABLE parent.html:14
8 TR TBODY parent.html:14
9 TD TR parent.html:14
10 TD TR

我不明白为什么td和tr会向父母展示。它们也将被视为已删除。有没有其他方法可以找出我的列表中已删除的项目。提前致谢

Answer 1

问题是你检查元素是否有父元素：

if ($(list[i]).parent().length == 0)

仅仅因为你从DOM中删除了一个元素并不意味着它的后代已经从该元素中删除了。他们已经从DOM中删除了（因为他们的父拥有），但他们仍然拥有该父级。

您可以使用closest来检查该元素是否具有body祖先：

if ($(list[i]).closest("body").length == 0)

由于元素不再存在于DOM中，因此它们不应具有body祖先。

作为旁注，由于0评估为false，您可以稍微简化一下条件：

if (!$(list[i]).closest("body").length)

识别不存在的html元素

1 个答案: