案例如下:

先来看一下直接效果:最大的区

 innerHTML 获取内容的时候,会把标签也获取到

 innerText 获取内容的时候,会把标签过滤掉

<!DOCTYPE html>
<html>
    <head lang="en">
        <title></title>
    </head>
    <body>
      <div id="box">box</div>

      <!-- <div id="box">
          我是box里面的p标签<p>我是一个段落</p>
      </div>
      <span></span>
      <a href=""></a>
      <p></p>
      &lt;p&gt; &nbsp; &copy; -->
        <script>
            var box = document.getElementById('box');
            // 老版本的IE支持innerText
            box.innerText = '';
            // 老版本的firefox 支持 textContent
            var a;//undefined
            var o={};
            console.log(o.a);//undefined

            //1 获取标签之间的内容
            // innerHTML 和 innerText 获取内容的区别
            // innerHTML 获取内容的时候,会把标签也获取到
            // innerText 获取内容的时候,会把标签过滤掉
            // console.log(box.innerText);
            // console.log(box.innerHTML);

            //2 设置标签之间的内容
            //设置内容的时候,如果内容中又标签, 会解析标签
            // innerHTML 不是标准的dom属性
            //box.innerHTML = 'O(∩_∩)O哈哈~<b>程序员</b><p>这是一个段落</p>'
            // 设置内容的时候,如果内容中又标签,会对标签进行转义
            // 最早的IE中增加的属性,老版本的firefox不支持属性
            //老版本的firefox textContent
            //box.innerText = 'O(∩_∩)O哈哈~<b>程序员</b><p>这是一个段落</p>'
        </script>
    </body>
</html>