• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
    • Preguntas
    • Profesores
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Pruebas Online
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

270
Vistas
creando múltiples publicaciones de blog usando divs javascript

Usé el siguiente código que permite crear una "publicación de blog" que se compone de múltiples divs. Quiero que cada vez que hago clic en el botón se cree una nueva publicación de blog, pero lo que realmente sucede es que no se crean nuevas publicaciones y lo único que cambia es el contenido de los divs, para ser específicos, el contenido de contentDiv . En otras palabras, la entrada del usuario o el contenido de la publicación es lo único que cambia.

 const BtnAdd = document.getElementById("buttonpost1"); BtnAdd.addEventListener("click", AddNew); function AddNew() { var newhtml = document.getElementById("postbox").value; sessionStorage.setItem("page1content", newhtml); document.getElementById("postbox").value = ""; location.reload(); return false; } var newhtml2 = document.getElementById("profilecontent").innerHTML; var newhtml3 = document.getElementById("underpost").innerHTML; var newhtml4 = document.getElementById("commentcontent").innerHTML; sessionStorage.setItem("usercontent" , newhtml2); sessionStorage.setItem("belowcontent", newhtml3) sessionStorage.setItem("commentcont", newhtml4) const contentDiv = document.createElement("div"); const userDiv = document.createElement("div"); const lowerDiv = document.createElement("div"); const commentDiv = document.createElement("div"); const bigDiv = document.createElement("div"); bigDiv.classList.add("div-shadow"); contentDiv.classList.add("div-shadow2"); userDiv.classList.add("div-shadow3"); lowerDiv.classList.add("div-shadow4"); commentDiv.classList.add("div-shadow5"); userDiv.innerHTML = sessionStorage.getItem("usercontent"); contentDiv.innerHTML = sessionStorage.getItem("page1content"); lowerDiv.innerHTML = sessionStorage.getItem("belowcontent"); commentDiv.innerHTML = sessionStorage.getItem("commentcont"); var cWrapper = document.getElementById("contentwrapper"); bigDiv.appendChild(contentDiv); bigDiv.appendChild(userDiv); bigDiv.appendChild(lowerDiv); bigDiv.appendChild(commentDiv); cWrapper.appendChild(bigDiv);

¿Qué cambios debo hacer para permitir la creación de una nueva publicación de blog cada vez que el usuario hace clic en el botón de id buttonpost1 y no solo anular el contenido de la publicación existente (divs)?

almost 3 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

No veo ningún appendChild en su función AddNew , necesita crear y agregar nuevos elementos cada vez que se llama a la función AddNew .

Este es un ejemplo mínimo:

 const container = document.querySelector('#container'); const button = document.querySelector('button'); button.addEventListener('click', () => { addNewPost(); }); function addNewPost() { const newPost = document.createElement('div'); newPost.innerText = 'New Post'; container.appendChild(newPost); }
 <button type="button">Add New Post</button> <div id="container"></div>

almost 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda