innerHTML和innerTEXT的区别

<div id="box">
    <p>这是一个P标签</p>
    <p>这是一个P标签</p>
    <p>这是一个P标签</p>
    <p>这是一个P标签</p>
</div>

var box = document.getElementById("box");

   console.log(box.innerText); 
  

这是innerText的用法 ，直接获取标签之间的文本内容

   
   console.log(box.innerHTML);
   

这是一个innerHTML的用法,将标签之间的所有内容都打印了出来 ，包括标签，而且是将内容原样打印输出出来

还有另一种用法，就是设置的用法

box.innerText = "<ul><li>123</li><li>456</li><li>789</li></ul>";

innerText设置的时候，无法设置标签，会将标签进行转义直接显示出来

box.innerHTML="<ul><li>123</li><li>456</li><li>789</li></ul>";

如果给innertHTML赋值的话，会将里面的标签渲染解析出来，解析成正常的HTML标签

通常用innerHTML来进行字符串拼接操作