innerHTML与innerText区别

innerHTML与innerText

  • innerHTML指的是从对象的起始位置到终止位置的全部内容,包括Html标签。
  • innerText 指的是从起始位置到终止位置的内容,但它去除Html标签。

innerHTML 是所有浏览器都支持的，innerText 是IE浏览器和chrome 浏览器支持的，Firefox浏览器不支持。其实，innerHTML 是W3C 组织规定的属性；而innerText 属性是IE浏览器自己的属性，不过后来的浏览器部分实现这个属性罢了。

outerHTML

outerHTML指的是除了包含innerHTML的全部内容外, 还包含对象标签本身

总结

innerHTML是符合W3C标准的属性，而innerText只适用于IE浏览器（现在也适应chrome浏览器），因此，尽可能地去使用 innerHTML，而少用innerText，如果要输出不含HTML标签的内容，可以使用innerHTML取得包含HTML标签的内容后，再用正则表达式去除HTML标签，下面是一个简单的符合W3C标准的示例：

1
2
3
4
5
6
7
8
9
10
<html>  
    <head><title>innerHTML</title></head>  
    <body>  
        <div id="d1"><p id="p1">hello world </p></div>  
        <script>  
            var content = document.getElementById("p1");  
            alert(content.innerHTML.replace(/& lt;.+?>/gim,''));  
        </script>  
    </body>  
</html>

弹出的为去掉了html标签之后的内容