Question

In the console I have 180 failed to load resources, I need to get a list of these resources so that I can send a report to the webmaster with the images URLs. How can this be done?

Answer 1

If you can add a script to the page, you can bind a handler to the error event and track all failures:

$(function(){
  var errorImages = [];

  $('img').on('error', function(){
                errorImages.push(this.src);
              });

  $(window).on('load', function(){
    alert(errorImages);
  });
});

Working example: http://jsbin.com/iboyik/3

If you want to get all failed images on a page that is already loaded, that is a little trickier. I was able to do that by reloading all images:

(function(){
  var errorImages = [];
  $('img')
    .on('error', function(){
                    errorImages.push(this.src);
                 })
    .prop('src', function(i, src){return src;});
  // wait for all images to fail (bit of a hack)
  setTimeout(function(){alert(errorImages);}, 1000);
})();

Working example: http://jsbin.com/iboyik/2