是什么区别innerHTML,innerText并且childNodes[].value在JavaScript?
textContent和innerTextJavaScript有什么区别?
我可以使用textContent如下:
var logo$ = document.getElementsByClassName('logo')[0];
logo$.textContent = "Example";
Run Code Online (Sandbox Code Playgroud) 这篇博客文章表明,这对于避免布局颠簸textContent更为可取innerText.但它专注于检索元素的文本; 对于设置元素文本,相反的情况似乎是正确的 - 至少在以下示例中.
此示例使用innerText并不生成布局颠簸:
<style>
#test {
background-color: blue;
float: right;
width: 100px;
height: 100%;
}
</style>
Test test test
<div id="test"></div>
<script>
setInterval(function() {
document.querySelector('#test').innerText = 'innerText';
}, 100);
</script>
Run Code Online (Sandbox Code Playgroud)

但替换innerText用textContent,看着它鞭笞:

有人可以解释这种行为吗?我可以做些什么来避免布局颠簸并仍然以基于标准的方式更改元素的文本?