1
respuesta

[Duda] Problema al trabajar con Módulos en JavaScript

Buenas comunidad! Estoy tratando de exportar una función de un módulo hacia otro pero cuando lo hago me trae problemas. Creo que está vinculado al hecho de que cada uno de estos archivos JavaScript los estoy ejecutando desde 2 archivos html distintos.

Tengo un 'index.html' con este script asociado:

<script type="module" src="agregar-palabras.js"></script>

Por otro lado, tengo un 'juego.html':

<script type="module" src="juego.js"></script>

En el módulo 'agregar-palabras.js' estoy importando una función que pertenece al archivo 'juego.js':

import { guardarPalabras } from "./juego.js";

En 'juego.js':

export { guardarPalabras };
function guardarPalabras() {
// resto del código
}

El problema es que ahora, cuando ejecuto el 'index.html' (asociado a 'agregar-palabras.js'), intenta acceder a una variable que declaro en 'juego.js'.

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

const btnHome = document.querySelector("[data-home]");
btnHome.addEventListener('click', () => {
    window.location.href = "index.html";
})

Este error no se producía hasta que intente exportar una función de un archivo a otro. Cuando ingreso a 'juego.html' el error desaparece (porque JavaScript sí puede acceder al elemento html), el problema se produce en el 'index.html'. Con las demás funciones no se produce ningún error, el tema son esas variables que acceden al DOM.

Como el 'index.html' no ejecuta 'juego.js', no entiendo por qué intenta acceder a las variables declaradas en él. Mi intención era que tenga acceso únicamente a una función específica, no a todo el archivo.

No sé si me supe explicar, soy nueva en esto y todo me resulta bastante confuso :( Si alguien me puedo guiar un poco se lo agradecería muchísimo!

1 respuesta

Hola Augustina,

¿Acaso tus archivos index.html y juego.html están relacionados de alguna manera?

Lo que está causando este error es probablemente porque la forma en que llama al archivo HTML con querySelesctor no es correcta, compruebe que este data-home existe o está escrito correctamente.

Un saludo!

Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios