publicaciones de ejemplo en mi sitio Tengo una lista de publicaciones en mi página de inicio, y cuando un usuario hace clic en ella, quiero mostrar la publicación detallada (en una página nueva). No estoy buscando el código aquí, solo quiero ayuda para averiguar cómo se haría. Las publicaciones se guardan en una tabla de prueba en una base de datos mySQL. Cuando un usuario hace clic en una sola publicación, quiero mostrarle una nueva página (simplemente usaré eventListener para mostrar una nueva página.html o algo así) con la descripción. Aquí es donde se puso complicado, quiero que las descripciones de las publicaciones se carguen dinámicamente para no tener que ingresar y crear archivos HTML individuales para cada publicación. Esto es lo que he hecho hasta ahora: (1) Las publicaciones en la página de inicio se procesan desde la base de datos MySQL: acabo de crear un nuevo div (className = "singlePost") y agregué el título y la descripción de la base de datos. (2) Se agregó un eventListener a cada div para que cuando se haga clic en él, el elemento div se registre en la consola y se use location.href para señalar al usuario una página en blanco (newPage.html). (3) Lo que no puedo entender es cómo pasar el contenido de cada div a la página en blanco. Cualquier ayuda sería apreciada. Gracias:)
//the code is pretty confusing but hope it helps //in node server.js app.get('/showposts', (req,res) => { console.log('will shows all posts in database'); connection.query(`select * from test`, (error, results) => { if (error) console.log(error); console.log('got data from database'); res.send(results) } ) }) //in the main.js file document.addEventListener( 'DOMContentLoaded', () => { fetch('http://localhost:4000/showposts') .then(response => response.json()) .then(data => { // console.log(data); for (i in data) { // console.log(data[i]); singlePost = document.createElement('div'); singlePost.className = 'singlePost'; titleTextNode = document.createTextNode(data[i].title); descriptionTextNode = document.createTextNode(data[i].description); postHeading = document.createElement('h2'); postHeading.appendChild(titleTextNode); singlePost.appendChild(postHeading); singlePost.appendChild(descriptionTextNode); allPosts.appendChild(singlePost); // console.log(postHeading); // console.log(singlePost); clickableSinglePost = document.getElementsByClassName('singlePost'); } for (let k = 0 ; k < clickableSinglePost.length; k++) { clickableSinglePost[k].addEventListener( 'click', () => { console.log(clickableSinglePost[k]); location.href = "http://localhost:4000/singlePost.html"; } ) }