js API web avanzadas: la diferencia entre innerText e innerHtml

1. Al configurar (escribir) el contenido del elemento:

• innerText: no reconoce las etiquetas html
• innerHtml: Identificar etiquetas html

<div id="first"></div>
<div id="second"></div>

<script>
    var firstDiv = document.querySelector('#first');
    firstDiv.innerText = '<strong>今天是：</strong> 2021';

    var secondDiv = document.querySelector('#second');
    secondDiv.innerHTML = '<strong>今天是：</strong> 2021';
</script>
    

2. Al obtener el contenido del elemento (lectura):

• innerText: elimine espacios, saltos de línea y etiquetas html (solo mantenga contenido válido puro)
• innerHtml: salida como está

<p>
 我是文字
    <span>123</span>
</p>

<script>
    var p = document.querySelector('p');
    console.log(p.innerText);
    console.log(p.innerHTML);
</script>