如何使用JS从<img>元素中获取多个值?

I have an <img> element and all of its image data stored. I want to get one by one all of the data of image in jQuery

<img class="enent_inst" id="myImg" style="width:100%;" alt="<?php echo $events[$j]['title']; ?>" src="<?php echo base_url(); ?>/Event_gallary/<? php echo $events[$j]['event_image']; ?>" />

JS code:

$(document).on('click','#myImg',function(){
  var img = document.getElementById('myImg').attr( "alt" ); 
  alert(img);
};

change attr to getAttribute

or use jQuery:

var img = $('#myImg').attr( "alt" ); 

Just replace document.getElementById('myImg') with $(this) to receive the element by jQuery, as you already use it ...

$(document).on('click', '#myImg', function() {
  var img = $(this).attr("alt");
  alert(img);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img class="enent_inst" id="myImg" style="width:100%;" alt="test" src="" />

</div>