innerText和textContent的区别
- 设置文本替换时,两者都会把指定节点下的所有子节点也一并替换掉。
- textContent 会获取所有元素的内容,包括
<script>
和<style>
元素,然而 innerText 不会。 - innerText 受 CSS 样式的影响,并且不会返回隐藏元素的文本,而textContent会。
- 由于 innerText 受 CSS 样式的影响,它会触发重排(reflow),但textContent 不会。
- innerText 不是标准制定出来的 api,而是IE引入的,所以对IE支持更友好。
- textContent虽然作为标准方法但是只支持IE8+以上的浏览器,在最新的浏览器中,两个都可以使用。
- 综上,Vue这里使用textContent是从性能的角度考虑的。
对于第3点的理解
注意是不可以获取隐藏的子元素里的文本内容!!!但如果是对有隐藏效果的父元素取值的话,无论它的子元素是否带有隐藏属性,都是可以取到文本内容的
从性能上考虑的话,textContent的性能的确要比innerText的执行效率要高