0

Realicé este código para que por medio del evento onclick mande un string al js para enviar un alert, luego en esta misma función envíe a otra para realizar un contenedor div con la función createElement y la muestre en una página web diferente, lo malo es que no me muestra dicho contenido y no encuentro solución. Adjunto el código:

HTML

<th><a class="reserva_dia" href="#" id="btn" onclick="Reserva('101 de 7:00-8:00');" >RS</a></th>

JS

function Reserva(string){
  alert("Se realizó su reserva ");
  crearReserva(string);
}

document.body.onload = crearReserva ()

function crearReserva(string){
    //variables a crear

    //div principal
    const reserva__div = document.createElement ("div");
    //texto
    const textoReservas = document.createTextNode('Reserva en el aula',string);


    //style css 
    reserva__div.classList.add ("contenedorDiv");
      

    //seleccionar a la clase padre
    const cont_reservas = document.querySelector('.cont_reservas');


    //agregar contenido
    cont_reservas.appendChild(reserva__div);
    cont_reservas.appendChild(textoReservas);


}

Captura del resultado

enter image description here

2
  • Intenta eliminando el punto y coma del final en tu string de onclick. Reserva('101 de 7:00-8:00')
    – zaraterdz
    Commented el 8 nov. 2022 a las 23:49
  • no funciona bro ya lo probé
    – xELDIEGOx
    Commented el 9 nov. 2022 a las 0:25

2 respuestas 2

0

puedes hacerlo asi:

function Reserva(string){
  alert("Se realizó su reserva ");
  crearReserva(string);
}

function crearReserva(string){
     //variables a crear

    //div principal
    const reserva__div = document.createElement ("div");
    //texto
    const textoReservas = document.createTextNode('Reserva en el aula: '+string);


    //style css 
    reserva__div.classList.add ("contenedorDiv");
      

    //seleccionar a la clase padre
    const cont_reservas = document.querySelector(".cont_reservas");


    //agregar contenido
    // va alrevez
    // al div se le asigna el textoNode
    reserva__div.appendChild(textoReservas);
    // y al selector se le asigna el div
    cont_reservas.appendChild(reserva__div);


}

// se comenta porque si no se ejecuta al cargar la pagina
//document.body.onload = crearReserva()
<th><a class="reserva_dia" href="#" id="btn" onclick="Reserva('101 de 7:00-8:00')" >RS</a></th>

<div class="cont_reservas">hola</div>

0

Prueba esto a ver si te funciona:

Realiza lo mismo, click al <a>RS</a> seguido aparece el alert y cuando sales del alert aparece el div con el string Reserva en el aula: 101 de 7:00-8:00

Crea un solo div:

function Reserva(string){
  alert("Se realizó su reserva ");
  crearReserva(string);
}

function crearReserva(string){
    let divNuevo = document.getElementById("nuevo_div");
    divNuevo.innerHTML = `<div>Reserva en el aula: ${string}</div>`;
}

Crear varios div:

function Reserva(string){
  alert("Se realizó su reserva ");
  crearReserva(string);
}

function crearReserva(string){
    let div = `Reserva en el aula: ${string}`;
    const reserva__div = document.createElement ("div");
    const textoReservas = document.createTextNode(div);

    const cont_reservas = document.querySelector(".cont_reservas");

    reserva__div.appendChild(textoReservas)
    cont_reservas.appendChild(reserva__div);
}

HTML

<th>
   <a id="reserva_dia" onclick="Reserva('101 de 7:00-8:00')">RS</a>
</th>
<div class="cont_reservas"></div>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.