现在想要的目标是：html 标签不要显示出来，而是应该去规范 html 文档的显示效果，比如遇见
<p>
标签则另起一个段落。
而实际上呢，浏览器端在进行
DOM
渲染时，把形如
<
、
>
这样的字符串，解析成了
<
、
>
，继而把
<p>
解析为
<p>
这样的
HTML
标签。然后就直接把解析后的字符串直接显示在了页面中，不再进行
html
标签语义分析。由此可以看出，浏览器端自己转义了
转移字符
，这样的好处很明显，可以有效的避免代码注入攻击，提升网站的安全原因。
如此分析一番后，解决的方案也就水落石出了：在浏览器
DOM
渲染前，先把形如
<
、
>
这样的字符串解析成
<
、
>
，再把解析后的新的字符串（形如
<p>感知和体验...</p>
）进行
DOM
渲染操作，即可在终端页面上渲染出最终与其的结果。
正确的渲染结果如下图所示：
* 把转义后的字符串反转义成含有 html 标签的字符串。
* 示例：
* HTMLDecode("<p>什么是3D打印？"); // "<p>什么是3D打印？"
* @param text
const HTMLDecode = text => {
let tmp = document.createElement('div');
tmp.innerHTML = text;
const output = tmp.innerText || tmp.textContent;
tmp = null;
return output;
* 转义含有 html 标签的字符串。
* 示例：
* HTMLEncode("<p>什么是3D打印？"); // "<p>什么是3D打印？"
* @param html
const HTMLEncode = html => {
let tmp = document.createElement('div');
(tmp.textContent != null) ? (tmp.textContent = html) : (tmp.innerText = html);
const output = tmp.innerHTML;
tmp = null;
return output;
对于本篇文章开头的问题，在渲染
meaningVaule
字符串前，调用一下
HTMLDecode
方法即可，如下：
const destStr = HTMLEncode(data.meaningValue);
// 再把`destStr`渲染到 DOM 中...
解读 innerHTML、innerText、textContent
innerHTML
由于innerText和textContent均为对innerHTML内容作不同的处理而成，因此我们需要先明确innerHTML属性的特点。
赋值操作：
赋值操作，即先对值的内容进行模式匹配，然后把处理后的值赋予给innerHTML属性。模式匹配结果将导致 保留 和 将字符转换为HTML实体 两个操作。
一. 以下情况将被保留：
HTML实体（ASCII实体、符号实体和字符实体）的实体名或实体编号；
符号实体和字符实体对应的字符；
没有HTML实体与之对应的字符；
HTML标签。(如<img>)。
二. 以下情况将会执行字符转换为HTML实体：
ASCII实体对应的字符（<、>、&、'和"）。
也就是说除了单独的 <、>、&、'和" 会被转换为实体名外，将原封不动地将值赋予给innerHTML属性。
取值操作：
取值操作，即直接获取innerHTML属性值。
innerText & textContent
由于innerText并非 W3C 标准属性，尤其是FireFox 45 之前的版本不支持innerText方法。因此一般情况下可以使用textContent来代替，但它两者是否就能完全等同呢？实际并非如此！
区别：取值时 innerText会把只会获取节点里面的文本信息，而innerHTML 会获取节点下面的所有标签。innerHTML是符合W3C标准的属性，而innerText只适用于IE浏览器，因此，尽可能地去使用innerHTML，而少用innerText
IE中的innerText是需要对innerHTML的值进行：
HTML转义（等同于XML转义，对<、&等转义字符进行处理）；
经过HTML解释和CSS样式解释；
之后又剔除格式信息之后留下的纯文本。
而FF中的textContent没有2、3步，在经过了HTML转义之后直接剔除所有html标签后得到的纯文本。
一言以蔽之，这一部分主要涉及到浏览器的兼容性问题。主要思路有以下两个：
可以采用上面给出的 HTMLDecode() 与HTMLDecode()方法，来进行 html 标签的转义与还原处理。
