Question

我开始探索如何使用Javascript操作DOM。我从最基本的开始，但我立即被卡住了。

所以从W3我发现HTML中有3种类型的节点：

元素
属性
文本

将此代码段作为示例<p id="myId">My paragraph</p>我会说：

<p>
ID
我的段落

但是当我在代码中应用这个概念时，它不起作用。这是我的例子：

<! DOCTYPE html>
<html>
<head></head>
<body>    
    <script>

        var htmlElement = document.documentElement;
        var headElement = htmlElement.firstChild
        var bodyElement = headElement.nextSibling;

        alert (bodyElement.nodeType);

    </script>
</body>

正如你可以想象的那样，我的变量名称，我希望得到“1”作为我的警报（它将是元素'body'），而是我收到一个“3”这是一个文本。但我的“头”元素中没有任何文字。

我该如何解释？

Answer 1

JavaScript也关注新行（\ n），所以当你使用nextSibling时，它也会得到换行符。

所以，使用以下代码：

headElement.nextSibling

现在会导致\n获取您需要再次使用nextSibling的body元素：

headElement.nextSibling.nextSibling

或者，您可以使用nextElementSibling获取element类型的下一个兄弟：

headElement.nextElementSibling

在Javascript中遍历DOM（nodeType）

1 个答案: