18.innerHTML、outerHTML、innerText

获取：

①innerHTML :属性设置或返回该标签内的HTML。也就是从对象的起始位置到终止位置的全部内容,包括Html标签。
②outerHTML：属性设置或返回该标签及标签内的HTML。也就是从对象的该标签起始到终止位置的全部内容,包括Html标签。
如果要输出不含HTML标签的内容，可以使用innerHTML取得包含HTML标签的内容后，再用正则表达式去除HTML标签，
③inneText：从起始位置到终止位置的内容，但它去除html标签。（只能在IE和chrome下使用）
④outerText 设置(包括标签)或获取(不包括标签)对象的文本
⑤value：属性可设置或返回密码域的默认值。获取文本框的值

html:

<div id='test'>您输入的值是：<span id="aqi-display">尚无录入</span></div>

js:

<script>
var test = e('#test')
console.log('innerHTML', test.innerHTML)
console.log('outerHTML', test.outerHTML)
console.log('innerText', test.innerText)
console.log('outerText', test.outerText)
console.log('value', test.value)
</script>

区别

设置：

备注：innerText 和outerText 在读取得时候是一样的，只是在设置的时候outerText 会连带标签一起替换成目标文本
同理 innerHTML, outerHTML. 只不过它们操作的不是text而是HTML.

原来 点击change_innerText
点击change_outerText Paste_Image.png Paste_Image.png

备注：参考 [赵晓盼]
[博客]