aquí está mi secuencia de comandos, pero por ahora es HTML interno en la misma página. Envuelvo mi tarjeta de película en una etiqueta para redirigir a la segunda página, pero no puedo entender cómo hacer que esto ejecute la función displayMovieInfo() en la página de destino. He estado tratando de resolverlo y hacer investigaciones durante 3 días, sin éxito. agradecería su ayuda (estoy aprendiendo JS)

 getMovies(API_URL) async function getMovies(url) { const res = await fetch(url); const data = await res.json(); console.log(data); displayMovies(data.results); } function displayMovies(movies) { moviesWrapper.innerHTML = ''; // movies.forEach((movie) => { movies.slice(-4).forEach((movie) => { const { title, poster_path, vote_average, overview } = movie; const movieElement = document.createElement('div'); movieElement.classList.add('movie-card'); movieElement.innerHTML = ` <a href="film.html"><img src="${IMAGE_PATH + poster_path}" alt="${title}"/> <div class='movie-content'> <div class='desc'> <h2>${title}</h2> ${vote_average} </div> </div> </a> ` moviesWrapper.appendChild(movieElement); movieElement.onclick = function displayMovieInfo() { const movieInfo = document.getElementById('about'); // movieInfoContainer.classList.add('about'); movieInfo.innerHTML = ` <h2 class="about-title">${title}</h2> <hr> <div class='about-content'> <img class="about-img" src="${IMAGE_PATH + poster_path}" alt="${title}"/> <div class='description'> <p>${overview}<p> </div> </div> ` // movieInfo.appendChild(movieSpec); movieInfo.scrollIntoView(true); }; }); };