Get src of an image when mouse over

JavaScript
1

I am trying to get in console the src of the image when I pass the mouse over the image, but I have not success and I don’t know the reason.
CODEPEN: https://codepen.io/ricardorien/pen/WNOKYMm?editors=1111

    <div class="gallery">
      <img class="gallery-img" src="https://source.unsplash.com/500x500/?architecture,japan">
      <img class="gallery-img" src="https://source.unsplash.com/500x500/?architecture,usa">
      <img class="gallery-img" src="https://source.unsplash.com/500x500/?architecture,australia">
      <img class="gallery-img" src="https://source.unsplash.com/500x500/?architecture,chile">
      <img class="gallery-img" src="https://source.unsplash.com/500x500/?architecture,england">
      <img class="gallery-img" src="https://source.unsplash.com/500x500/?architecture,holand">
    </div>

I’m trying with, but I can’t see what is wrong:

const selectedImg = document.querySelectorAll('.gallery-img')

function getSrc(e) {
  const src = e.currentTarget.document.querySelector('img').src
  return console.log(src)
}

selectedImg.forEach(e => {
  e.addEventListener('mouseenter', getSrc)
})
2

@ricardoaguilarm you are setting the mouseenter event handler of each image. In that case, the e.currentTarget refers to the image itself.

const selectedImg = document.querySelectorAll('.gallery-img')

function getSrc(e) {
  const src = e.currentTarget.src
  return console.log(src)
}
selectedImg.forEach(e => {
  e.addEventListener('mouseenter', getSrc)
})
3

Oh my goodness, I don’t know what I was thinking. Thank you so much.

4

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.