javascript - How do I pass the image object into the onclick function being assigned to it? -

Sorry, if that question is confusing, then I'm learning JavaScript myself, I'm dynamically generating image thumbnails and When the user clicks on the thumbnail, I want to enlarge the image. My code looks like this for creating image code and assigning onclick function ...

var imageTag = "& lt; img onclick = \" enlargeImage () \ "class = \" Thumbs \ "Src = \" "+ photoURL +" \ "/" /> "; Document.getElementById ("image-thumbnail"). InnerHTML = imageTag;

With the code above, my thumbnail is displayed and when the user clicks on it, the enlargeImage () function is called . My question is, how can I use an image object clicked inside the enlargeImage () function? Tried to reach the this object inside the function, pointing to that image that was clicked, but this was referring to the whole page, not the The image was clicked. I want to be able to change the src attribute, as well as changing the style attributes of the image thumbnails. I should also note that there will be many images after all, so I need this dynamic behavior is.

Thank you very much for your help!

There are some ways to do this: The simplest way is to change the AA parameter to enlargeImage () Add it to the function and when you call it, pass it this reference.

  var ImageTag = "& lt; img onclick = \" big size (this) \ "square = \" thumb \ "src = \" "+ photoURL +" \ "/> ; ";  

Then in the function ...

  function big size image (IMG) {alert (IMGSRC); }