js-innerHtml与innerText的区别

<div id="box">
    我是一个div
    <span>这是一个span标签</span>
</div>
<p>111</p>

<b>123</b>

<script>
    var box = document.getElementById('box');
    console.dir(box);

    /* innerHtml  innerText */
    console.log(box.innerHTML);  //我是一个div <span>这是一个span标签</span>  ///带标签,原文原封不动的输出,包括标签

    console.log(box.innerText);  //我是一个div 这是一个span标签,  ///过滤标签,只输出文本内容

    box.innerHTML = '<b>黑马</b>程序员';  //清空文本内容  -- 标签会生效    黑马程序员  黑马字体加粗了
    // box.innerText = '<b>黑马</b>程序员';//清空文本内容  -- 标签不会生效,内容原封不动的显示,将转义字符变成字符  <b>黑马</b>程序员
</script>