Bien, entonces en mi página web estoy tratando de actualizar el texto dentro de un div contenido dentro de estos elementos de intervalo.
<div class="output-1-2-1-1"> <p id="yourNameDisplay">Person</p> </div> <div class="output-1-2-1-2"> <p>Born in <span id="yourMonthDisplay">February</span></p> </div>Mi método actual para hacer esto es el siguiente. La entrada se registra desde cuadros de texto utilizando estas declaraciones en una función después de hacer clic en un botón. Lo he comprobado y la identificación "yourMonth" coincide con el cuadro de entrada, por lo que ese no es el problema.
var yourMonth = document.getElementById("yourMonth").value;Y luego la variable se muestra llamando al ID del elemento en la misma función a continuación.
document.getElementById("yourMonthDisplay").innerHTML = yourMonth;Pero por alguna razón, las variables no aparecen en el texto después de hacer clic en el botón. He verificado para asegurarme de que están allí usando un div completamente separado en otra ubicación y aparecen allí bien. Los llamé y los mostré usando el mismo método y funcionan bien, de la siguiente manera:
document.getElementById("output5").innerHTML = yourMonth;¿Hay algún método alternativo que pueda recomendar para mostrar estas variables que sea mejor?
Está utilizando innerHTML para poner texto puro en una etiqueta de intervalo. Debería funcionar, pero tal vez intente con texto interno en su lugar.
document.getElementById("output5").innerText = yourMonth;(como se mencionó anteriormente en los comentarios, es bueno proporcionar más contexto en su pregunta original)
¿Su evento se activa después de hacer clic en el botón? en caso afirmativo, obtiene el valor del campo de entrada. ¿Puedes capturar el valor del campo de entrada? en caso afirmativo, puede colocar el nuevo valor dentro de la etiqueta span con el selector yourMonthDisplay y no output5 . Tienes el selector equivocado.
y el código funcionará.
function swapMonth() { let yourMonth = document.getElementById("yourMonth").value; document.getElementById("yourMonthDisplay").innerHTML = yourMonth; } <input id="yourMonth"> <button onclick="swapMonth(this)">swap</button> <div class="output-1-2-1-1"> <p id="yourNameDisplay">Person</p> </div> <div class="output-1-2-1-2"> <p>Born in <span id="yourMonthDisplay">February</span></p> </div>