示例代码：
<div id="test"> ???<p>这是innerHTML</p> ???<p>这是innerHTML</p></div>
innerHTML：
//读var test = document.getElementById(‘test‘);console.log(test.innerHTML);//写test.innerHTML = ‘<p>重新写入innerHTML</p>‘;console.log(test.innerHTML);
结果如下：
//读取结果<p>这是innerHTML</p><p>这是innerHTML</p>//写入结果<p>重新写入innerHTML</p>
outerHTML：
//读var test = document.getElementById(‘test‘);console.log(test.outerHTML);//写test.outerHTML = ‘<p>重新写入outerHTML</p>‘;console.log(test.outerHTML);
结果如下：
//读<div id="test"> ???<p>这是innerHTML</p> ???<p>这是innerHTML</p></div><div id="test"> ???<p>这是innerHTML</p> ???<p>这是innerHTML</p></div>
这里要注意一个问题，就是给outerHTML写入内容的时候，会将元素本身替换掉，这一点可以通过审查页面结构可以看出来。故，我们打印出来的结果其实是原来的元素内容，重新写入的结果需要通过审查页面结构才可以看出来！！！！
结论：
innerHTML 和 outerHTML 的区别就是：outerHTML 会获取（替换）元素本身。
innerHTML 与 outerHTML区别
原文地址：http://www.cnblogs.com/intangible/p/7533566.html