文本在 DOM 中是否也被视为节点?

meJ*_*rew 3 html javascript dom

我开始阅读关于 JavaScript 和 DOM 的内容,我在这个网站上发现了这样的结构:

<html>
  <head>
    <title>The title</title>
  </head>
  <body>
     The body
   </body>
</html>
Run Code Online (Sandbox Code Playgroud)

文本标题正文也被视为节点,如下图所示(来自同一站点):

DOM 表示

请注意,标题正文表示为实际标题相应正文节点的子项。是什么让我困惑的是:不是标题正文文本只是节点的值<title><body>

我在http://www.w3schools.com/js/js_htmldom_navigation.asp上遇到了一个类似的例子,其中结构如下:

<html>
  <head>
      <title>DOM Tutorial</title>
  </head>
  <body>
      <h1>DOM Lesson one</h1>
      <p>Hello world!</p>
  </body> 
</html>
Run Code Online (Sandbox Code Playgroud)

<h1><p>元素的值也像节点一样描述:

<h1> 有一个孩子:“DOM 第一课”

<p> 有一个孩子:“世界你好!”

为什么节点内的文本值被视为不同的节点,而不仅仅是包含它们的节点的文本值?

谢谢!

Max*_*kyi 5

让我困惑的是:标题和正文不是节点的值吗?

不,它们实际上是这些节点的子节点。您可以通过输出标签的children属性来查看它title

document.querySelector('title').children
Run Code Online (Sandbox Code Playgroud)

文本节点被表示为Node.TEXT_NODE=3提到这里。只有表单 DOM 元素(如输入)具有value属性,并且在这些输入中输入的文本包含在那里。

除了文本节点,还有注释节点,如下所示:

<title><!-- DOM Tutorial --></title>
Run Code Online (Sandbox Code Playgroud)

为什么节点内的文本值被视为不同的节点,而不仅仅是包含它们的节点的文本值?

可能是因为它们需要在内存中表示不同的结构,以便可以对其进行操作,例如,更改文本的颜色。