title: Check whether an image exists, if not set a default image using Javascript
body: <p>I have a lot of images. like:</p>
  
  <pre><code>&lt;img src="src1"/&gt;
  &lt;img src="src2"/&gt;
  &lt;img src="src3"/&gt;
  </code></pre>
  
  <p>Some of the image maybe do not exist. So the browser will show a broken image picture. It is ugly. How to use Javascript not jQuery to determine whether an image exists? If not, give a local image to replace it. Thank you.</p>
  
  <p>I tried the code , it replaced all the images not only those not exist.</p>
  
  <pre><code>function imgError(image) {
              image.onerror = "";
              image.src = "http://www.hi-pda.com/forum/uc_server/data/avatar/000/85/69/99_avatar_middle.jpg?random=10.20420048222877085";
              return true;
          }
  
          var imgs = document.getElementsByTagName("img");
          for (var i = 0; i &lt; imgs.length; i++) {
              imgs[i].onerror=imgError(imgs[i]);
          }
  </code></pre>
  
  <p>the images are </p>
  
  <pre><code>&lt;img src="rrrrr"  /&gt;
      &lt;img src="http://www.hi-pda.com/forum/uc_server/data/avatar/000/52/56/39_avatar_middle.jpg"/&gt;
  </code></pre>
  
  <p>the first picture does not exist , the second one exists. when I run it in chrome , all the picture were replaced...</p>