1.innerHTML:设置或获取对象起始标签和结束标签之间的内容。如：

    
     hello world
    
    
     segmentfault
     
dazhuaoyao
    

执行console.log(document.getElementById('div1').innerHTML);输出：hello world

执行console.log(document.getElementById('div2').innerHTML);输出：<span>segmentfault</span> <p>dazhuaoyao</p>执行document.getElementById('div1').innerHTML=‘node’会设置div1中的内容为：node执行document.getElementById('div1').innerHTML='<div>'+'node'+'</div>',此时页面显示的内容依旧是node,标签名会自动解析，不会输出。

2.innerText:设置或获取位于对象起始和结束标签内的文本。使用上面的div操作：

执行console.log(document.getElementById('div1').innerHTML);输出：hello world执行console.log(document.getElementById('div2').innerHTML);输出：segmentfaultdazhuaoyao注意到区别了吗，输出div2中的内容时，标签是不包含在内的。在设置innerText时，执行：document.getElementById('div1').innerText='<div>'+'node'+'</div>';此时页面显示的内容是<div>node</div>，此时标签名没有被解析，当作字符原样输出。

3.outerHTML:设置或获取对象及其内容的 HTML 形式。使用上面的div操作：

执行console.log(document.getElementById('div1').innerHTML);输出：<div id="div1">hello world</div>执行console.log(document.getElementById('div2').innerHTML);输出：<div id="div2">

segmentfault
dazhuaoyao

</div>

与innerHTML不同的是，对象本身的标签也包含进去了。在设置outerHTML时，和innerHTML一样

4.outerText:设置或获取对象的文本。使用上面的div操作：

执行console.log(document.getElementById('div1').outerText);输出：hello world执行console.log(document.getElementById('div2').innerHTML);输出：segmentfaultdazhuaoyao不过，设置outerText的值时，可以解析标签名。