JavaScript innerText 和 textContent 的区别

innerText 和 textContent 的区别

---

innerText的值依赖于浏览器的显示，textContent依赖于代码的显示

如下代码：

第一个

第二个

输出结果：

innerText:第一个 第二个

textContent:

        第一个

        第二个

---

如果一个元素之间包含了script标签或者style标签，innerText是获取不到这两个元素之间的文本的，而textContent可以，如下代码：

    第一个

    第二个

输出结果：

innerText:第一个 第二个

textContent:

    var a=111;

    第一个

    第二个 

---

这个区别是由第一个区别引申而来的，在浏览器中自然是不会在屏幕中输出script和style标签之间的内容，而innerText的值依赖于浏览器的显示，所以仍然是666 999。

textContent会把空标签解析成换行（几个空标签就是几行），innerText只会把block元素类型的空标签解析换行，并且如果是多个的话仍看成是一个，而inline类型的原素则解析成空格，如下代码：

第一个

   

    第二个

输出结果：

innerText:第一个 第二个

textContent:

    第一个

    第二个