他们的作用分别是：
- innerHTML 设置或获取位于对象起始和结束标签内的 HTML
- outerHTML 设置或获取对象及其内容的 HTML 形式
- innerText 设置或获取位于对象起始和结束标签内的文本
- outerText 设置(包括标签)或获取(不包括标签)对象的文本
比较：
- innerHTML与outerHTML在设置对象的内容时包含的HTML会被解析，而innerText与outerText则不会。
- 在设置时，innerHTML与innerText仅设置标签内的文本，而outerHTML与outerText设置包括标签在内的文本。
举例：
假如页面里有这样一个标签，<div id="test">测试效果</div>，我们分别执行这四种操作的结果是：
//执行：innerHTML
test.innerHTML="<i>refined-x.com</i>";
//结果：<div id="test"><i>refined-x.com</i></div>
//执行：innerText
test.innerText="<i>refined-x.com</i>";
//结果：<div id="test"><i>refined-x.com</i></div>
//执行：outerHTML
test.outerHTML="<i>refined-x.com</i>";
//结果：<i>refined-x.com</i>
//执行：outerText
test.outerText="<i>refined-x.com</i>";
//结果："<i>refined-x.com</i>"
