Question

我正在搞乱DOM树。特别是这个HTML代码

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>MovieApp</title>
        <!-- <link rel="stylesheet" href="style.css"> -->
        <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
        <script src="script.js"></script>
    </head>
    <body>
        <div>
            <h1>MovieApp</h1>
            <input type="text" name="movie-title" size="50" 
                placeholder="Enter movie title..." />
            <input type="submit" name="search" value="Search"/>
        </div>
    </body>
</html>

还有我无法弄清楚的事情。当我检查节点子节点（document.documentElement.childNodes[i]）时，我总是得到三个孩子而不是我期望的两个孩子：

<head> node
的 #text
<body> node

这个#text节点是什么？在JSFiddle我得到的结果相同。

提前致谢。

Answer 1

查看textContent或其他类似的属性 - 它是换行符和一些空格，正好位于</head>和<body>之间。

所以没有什么＆＃34;有用＆＃34;在head和body之间，但该空间仍在那里。

考虑：

<div><a href="#">Some Link</a> Some Text <a href="#">Another Link</a></div>

这将有三个节点 - 第一个链接，文本和第二个链接。同样的交易，除了你的＆＃34;文字＆＃34;只是一堆空白。

为什么DOM树中头部和身体节点之间有文本节点？

1 个答案: