不可忽略的空格

问题描述

富文本编辑器中需要实现一个可编辑的导航树，在上线运行时客户反馈其设置的导航树的空格不起作用。具体问题如下所示：

由此可以看到HTML文本节点与渲染展示的内容不同，造成了用户直观感受到的输入空格不起作用。

问题原因

空格之所以被忽略是因为浏览器对HTML文本中空格的处理规则：文本的前部和后部的空格会被忽略，内部的连续空格只会算作一个，也就是说浏览器默认会忽略空格的存在。也就是说下面的代码是等价的：

<p>  hello  word  </p>
<p>  hello  word</p>
<p>hello  word  </p