JavaScript DOM innerHTML和innerText修改元素内容

在上一篇删除子节点的文章中，有提到一个属性innerHTML，元素对象都有innerHTML属性和innerText属性，但一般不用innerText属性，因为有浏览器兼容性问题，大多浏览器都不支持。
innerHTML属性：表示标签中内容，此内容可以是标签，也可以是纯文本。
innerText属性：表示标签中文本内容，此内容只能是纯文本，如果存在标签，则原样输出。

var h1 = document.createElement("h1");
h1.innerHTML = "好好学习，天天向上";
document.body.appendChild(h1);

如果再一次赋值，则会将上次内容覆盖掉。
innerHTML不仅可以写入内容，也能够读取内容，例如：

<div id="mydiv">
    写代码真的好有趣！
</div>
<script type="text/javascript">
    var mydiv = document.getElementById("mydiv");
    console.log(mydiv.innerHTML);
</script>

此时得到的结果即是：写代码真的好有趣！