4回答

• 

  进击君

  2016-12-08 17:54:31

  已采纳

  来来来，我们来好好理解一下哈。

  首先理解父节点和子节点的概念。子节点是父节点所包含的，父节点下一级的节点。也就是说，父节点下还可能有下两级的节点哦，但是那不是父节点的子节点，而是父节点的“孙节点”

  看代码：
  

  <div>
    javascript  
    <p>javascript</p>
    <div>jQuery</div>
    <h5>PHP</h5>
  </div>

  先不管什么空白节点，看着代码，我们来数一数div下面有几个子节点：javascript是文本节点，第一个。p标签是第二个，div是第三个，h5是第四个子节点。ok，子节点是4，然后我们运行代码，假设你代码都对了，出来的结果是几个子节点呢？7个！

  所以还有3个是什么呢？是浏览器认为的，在节点之间存在的文字节点！因为节点之间没有内容，所以才是空白的，称之为空白节点！

  看代码：

  <div>
    javascript  
    <p>javascript</p> //这里存在空白节点，位于节点p和div之间，第三个子节点
    <div>jQuery</div> //这里存在空白节点，位于节点div和h5之间，第五个子节点
    <h5>PHP</h5>     //这里存在空白节点，位于节点h5和div之间，第七个子节点。子节点和父节点之间也存在空白节点。
  </div>

  一共是3个空白节点，那么为啥开头的div和javascript之间没有空白节点呢？因为javascript本身就是文本节点，在这里充当了div和p标签之间的”空白节点“，但是它不是空白的呦，是有值的文本节点。
  

  也就是说，关键不是空白节点，而是文本节点，浏览器认为在节点之间必须存在文本节点，如果没有就给你加上空白节点！如果有就不加了

  回到你的问题，为啥Value没有值？它是空白节点哦，怎么有值？而只有第一个节点javascript是有值的

  不要把第三 第五 第七 节点理解为p div h5标签中的文本哦，那个也是文本节点，但是是”孙节点“ ，是子节点的子节点。 

  3 16

  Joanna

  厉害了！

  2017-02-01 19:38:14

  共 3 条回复 >

• 

  斟酒独酢

  2017-03-05 21:44:23

  谢谢，

  0 0
• 

  sin30

  2016-12-16 21:46:16

  这个答案让我明白了什么是空白节点。赞。

  0 0
• 

  qq_善美小姐_04172997

  2016-12-14 17:04:26

  解答的很清楚

  0 0