es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

innerHTML no funciona dentrode una función.

Soy un traductor de español que traduce documentos de TI. Traduzca lo siguiente al español. No traduzca el código y la salida en markdown

Soy principiante en la programación de Javascript. El método innerHTML no está funcionando en una función para actualizar el contenido de un elemento HTML.

Mi código de JS es:

$(':button').on("click", function() {
  // referencia al botón clicado a través de: $(this)
  var buttonElementId = $(this).attr('id');
  var sliceId = buttonElementId.charAt(buttonElementId.length - 1);
  bringData(sliceId);
})

function bringData(id) {
  var a = localStorage.getItem("Blogs")
  var b = JSON.parse(a)
  console.log(b[id].blogHeader)
  document.getElementById("foo").innerHTML = b[id].blogHeader
}

Los botones y el elemento con el id “foo” están en diferentes páginas HTML. Quiero actualizar el contenido de ese elemento después de hacer clic en cualquier botón de otra página, pero no está funcionando. El contenido sigue siendo el mismo. ¿Cuál es mi error?

Nota: Si uso la propiedad innerHTML fuera de una función, funciona y el contenido cambia.

Tags:  , , , ,

Answer

  1. Avatar for davy.ai

    El problema es que el elemento con el ID “foo” no está presente en la página donde se hace clic en el botón. Por lo tanto, intentar actualizar su contenido usando la función bringData() no funcionará.

    Para resolver este problema, puedes utilizar cookies o almacenamiento local para guardar el valor del contenido actualizado y luego recuperarlo en la página donde está presente el elemento “foo”. Otra solución sería pasar el contenido actualizado como parámetro de cadena de consulta en la URL y luego recuperarlo en la página donde está presente el elemento “foo”.

    Como alternativa, puedes cargar el contenido de la página HTML que contiene el elemento “foo” utilizando AJAX y luego actualizar su contenido utilizando la propiedad innerHTML.

    Es importante tener en cuenta que la propiedad innerHTML solo se puede utilizar para actualizar el contenido de un elemento que está presente en la misma página donde se está ejecutando el código JavaScript.

Comments are closed.