Remove Broken Images Using Dojo

By  on  

In an effort to get better with the Dojo Toolkit, I've decided to port yet another one of my previous posts: Remove Broken Images Using MooTools or jQuery. Broken images are an eyesore to any website so there's no point to keeping them in the page. Here's how you can remove them on the client side.

The Dojo JavaScript

dojo.ready(function() {
	dojo.query('img').forEach(function(img){
		dojo.connect(img,'onerror',function() {
			dojo.destroy(img);
		});
	});
});

Just as simple as jQuery and MooTools -- just a different syntax!

Recent Features

  • By
    9 Mind-Blowing Canvas Demos

    The <canvas> element has been a revelation for the visual experts among our ranks.  Canvas provides the means for incredible and efficient animations with the added bonus of no Flash; these developers can flash their awesome JavaScript skills instead.  Here are nine unbelievable canvas demos that...

  • By
    Introducing MooTools Templated

    One major problem with creating UI components with the MooTools JavaScript framework is that there isn't a great way of allowing customization of template and ease of node creation. As of today, there are two ways of creating: new Element Madness The first way to create UI-driven...

Incredible Demos

Discussion

  1. Some streamlining of your methods:

    dojo.query('img').connect('onerror', function() { dojo.destroy(this); });
    

    Nice site by the way :) Keep up the Dojo posts :)

  2. @Karl Tiedt: Applied to a collection — very nice! I’ll keep that in mind from this point forward.

  3. Robert Labbe

    Would you happen to have code to do this with prototype?

  4. Ben

    I wish images would fire an event if they didn’t load then we could put something in it’s place instead of going through every image checking. Kind of slow…

  5. @Ben: They do — they fire an onError event.

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!