Estoy tratando de construir un SPA (mi primer intento). Tengo un problema en el que intento activar mi contact-btn , pero no se activa. Mi contact-btn se dispara en mi barra de navegación, pero el botón de contacto que está en mi dashboard.js que se carga en el div de "aplicación" no funciona.
¿Alguien puede ayudar u ofrecer sugerencias sobre por qué esto no funciona?
guión.js
const buttons= document.querySelectorAll('.contact-btn'); buttons.forEach(element =>{ element.addEventListener("click", hey); }); function hey(){ console.log("hey") }tablero.js
async getHtml(){ return ` <div class="main"> <div class="section"> <div class="uvp"> </h1> <p>Think of a catchy uvp that will bring people in relating to building your online business.</p> <button class="contact-btn">Contact us</button> </div> <img src="images/Luke.png" alt="Image of me, Luke"> </div> </div>índice.html
<body> <header class="scrollHead"> <div class="logo"> <a href="/"><img src="/images/Luke.png" alt="luke logo of face" width="110px" height="auto"></a> <h2>luke</h2> </div> <nav> <a href="/About" data-link>About</a> <a href="/Portfolio" data-link>Portfolio</a> <button class="contact-btn" data-link>Contact us</button> </nav> </header> <div id="app"></div> <!-- Footer --> <script src="/static/js/index.js" type="module"></script> <script src="./script.js" type="module"></script> </body>