tratando de agregar texto a un elemento div existente usando un script. Debería agregar texto al elemento con la identificación "TopBarContainer, pero no sucede nada cuando ejecuto el script.
Probé creando el texto y simplemente agregándolo al cuerpo del documento cada vez que se ejecuta el script para asegurarme de que no haya un problema con la llamada del script o la creación del contenedor de texto/texto y esto funcionó bien.
Soy muy nuevo en html y javascript. Parece que debería ser muy simple, pero miré el tutorial en W3, busqué en el desbordamiento de la pila y miré información sobre appendChild y getElementById y no pude averiguar lo que me perdí.
La parte relevante del guión:
<div class="top" id= "TopBarContainer"> <img src="webibarmax.png" id="topbar" title="The bar" alt="Superbar"> </div> <script> myScript() { var TextContainer = document.createElement("p"); var TextItem = document.createTextNode("textextext"); TextContainer.appendChild(TextItem); document.getElementById("TopBarContainer").appendChild(TextContainer); document.body.appendChild(TextContainer);} </script> var TextContainer = document.createElement("p"); var TextItem = document.createTextNode("textextext"); TextContainer.appendChild(TextItem); document.getElementById("TopBarContainer").appendChild(TextContainer); document.body.appendChild(TextContainer); <div class="top" id="TopBarContainer"> <img src="webibarmax.png" id="topbar" title="The bar" alt="Superbar"> </div>Como puede ver en el fragmento anterior, su código parece funcionar bien.
De acuerdo con la documentación , no puede hacer referencia al mismo nodo dos veces como lo está haciendo en su ejemplo (una vez en el div y otra vez en el cuerpo:
Si el elemento secundario dado es una referencia a un nodo existente en el documento, appendChild() lo mueve de su posición actual a la nueva posición
¿Puede ser ese el problema que tienes?
var TextContainer = document.createElement("p"); var TextItem = document.createTextNode("textextext"); TextContainer.appendChild(TextItem); document.getElementById("TopBarContainer").appendChild(TextContainer);No necesita agregar el elemento TextContainer al cuerpo.