Skip to main content
modifique la respuesta para considerar varios elementos(iteración) y no solo 1
Origen Enlace
jsanbae
  • 144
  • 7

Utiliza la función querySelectorquerySelectorAll para llegar al nodorecorrer todos los nodos que buscas(asumo por el fragmento de código que veo, que solo hay un elemento con la clase cal-month.day), luego con dataset obtienes los datos del atributo data-*.

document.querySelectorquerySelectorAll(".cal-month-day")
    .forEach(btn => {
         btn.addEventListener('click', (event) => {
  console.log(       var dia = event.target.dataset.calDatecalDate;
         console.log(dia)
     });
});

Ver código funcionando en https://jsfiddle.net/nk8jd7ae/https://jsfiddle.net/k0qrcj6u/

Importante saber que cuando usas data-* los guiones se comportan como camelcase, por eso no queda dataset.cal-date, si no que queda como dataset.calDate.

Ojo esto es vanilla javascript(js puro), no Jquery.

Utiliza la función querySelector para llegar al nodo que buscas(asumo por el fragmento de código que veo, que solo hay un elemento con la clase cal-month.day), luego con dataset obtienes los datos del atributo data-*.

document.querySelector(".cal-month-day").addEventListener('click', (event) => {
  console.log(event.target.dataset.calDate);
});

Ver código funcionando en https://jsfiddle.net/nk8jd7ae/

Importante saber que cuando usas data-* los guiones se comportan como camelcase, por eso no queda dataset.cal-date, si no que queda como dataset.calDate.

Ojo esto es vanilla javascript(js puro), no Jquery.

Utiliza la función querySelectorAll para recorrer todos los nodos que buscas, luego con dataset obtienes los datos del atributo data-*.

document.querySelectorAll(".cal-month-day")
    .forEach(btn => {
         btn.addEventListener('click', (event) => {
         var dia = event.target.dataset.calDate;
         console.log(dia)
     });
});

Ver código funcionando en https://jsfiddle.net/k0qrcj6u/

Importante saber que cuando usas data-* los guiones se comportan como camelcase, por eso no queda dataset.cal-date, si no que queda como dataset.calDate.

Ojo esto es vanilla javascript(js puro), no Jquery.

se añadieron 55 caracteres en el cuerpo
Origen Enlace
jsanbae
  • 144
  • 7

Utiliza la función querySelector para llegar al nodo que buscas(asumo por el fragmento de código que veo, que solo hay un elemento con la clase cal-month.day), luego con dataset obtienes los datos del atributo data-*.

console.log(document.querySelector(".cal-month-dayday").addEventListener('click', span"(event) => {
  console.log(event.target.dataset.calDate);
});

Ver código funcionando en https://jsfiddle.net/nk8jd7ae/

Importante saber que cuando usas data-* los guiones se comportan como camelcase, por eso no queda dataset.cal-date, si no que queda como dataset.calDate.

Ojo esto es vanilla javascript(js puro), no Jquery.

Utiliza la función querySelector para llegar al nodo que buscas(asumo por el fragmento de código que veo, que solo hay un elemento con la clase cal-month.day), luego con dataset obtienes los datos del atributo data-*.

console.log(document.querySelector(".cal-month-day span").dataset.calDate);

Importante saber que cuando usas data-* los guiones se comportan como camelcase, por eso no queda dataset.cal-date, si no que queda como dataset.calDate.

Ojo esto es vanilla javascript(js puro), no Jquery.

Utiliza la función querySelector para llegar al nodo que buscas(asumo por el fragmento de código que veo, que solo hay un elemento con la clase cal-month.day), luego con dataset obtienes los datos del atributo data-*.

document.querySelector(".cal-month-day").addEventListener('click', (event) => {
  console.log(event.target.dataset.calDate);
});

Ver código funcionando en https://jsfiddle.net/nk8jd7ae/

Importante saber que cuando usas data-* los guiones se comportan como camelcase, por eso no queda dataset.cal-date, si no que queda como dataset.calDate.

Ojo esto es vanilla javascript(js puro), no Jquery.

Origen Enlace
jsanbae
  • 144
  • 7

Utiliza la función querySelector para llegar al nodo que buscas(asumo por el fragmento de código que veo, que solo hay un elemento con la clase cal-month.day), luego con dataset obtienes los datos del atributo data-*.

console.log(document.querySelector(".cal-month-day span").dataset.calDate);

Importante saber que cuando usas data-* los guiones se comportan como camelcase, por eso no queda dataset.cal-date, si no que queda como dataset.calDate.

Ojo esto es vanilla javascript(js puro), no Jquery.