I want to stop an image from loading (i.e., stop the request for the image) via JavaScript.

I imagine it would be something like this:

...
<script type="text/javascript">( if conditional, stop image )</script>
<img src="image.png" alt="image" />
...

The thing is, it can't involve a document.write() because I want the image to always load if the user does not have JavaScript enabled. It also cannot use <noscript> because I want search engines to index it, and <noscript> is not picked up by search engines. Any help would be greatly appreciated.

I think noscript is picked up by the search engines. People put all kinds of spam in that tag, and I can only think of one reason for that...

If you don't call out the script with the defer keyword, it will run while the page is rendering, so you could change the src of the img ... if it's already started downloading it'll look funny. This is probably something that ought to happen server side?

Why do you want to make the image visible to search engines, but not users?

<img id='nojs' src="image.png" alt="image" />

<script type='text/javascript'>

/*Leaves place holder empty; could specify alternative image*/

document.getElementById('nojs').src="";

// OR

/*Removes image placeholder from document*/

var imgNode;

(imgNode=document.getElementById('nojs')).parentNo de.removeChild(imgNode);


</script>

The browser will still make a request for the image because it the script occurs after the img in the source. Somehow I need to be able to access the img element before it's requested to disable it. Is that possible?

Originally Posted by frost

The browser will still make a request for the image because it the script occurs after the img in the source. Somehow I need to be able to access the img element before it's requested to disable it. Is that possible?

The script will instantly cancel/replace the request or remove the image placeholder.

Originally Posted by logic ali

The script will instantly cancel/replace the request or remove the image placeholder.

In at least Firefox 2.0, that is not true. The HTTP request is still sent with that script. You also can't cancel a request in HTTP after it is sent.

HTML is parsed from top to bottom. The img element is above the script element, so the img element is reached first. When the img element is reached, it will see what's in the src attribute and make the HTTP request for the image. While the response is being retrieved, the next line is reached in the HTML, but it is already too late for the script to disable it. I can tell this by checking the logs on my server that the image is still requested with this script.

The script (or a portion of it) must therefore be above the img element. The catch is that JavaScript cannot reference elements via document.getElementById() until the browser has parsed it. Maybe there is a way to stop all images on the page ahead of time, let the img element pass, call the script to disable that particular img, and finally reenable the rest of the page's images?

EDITS:
Sorry I didn't state this in my first two posts: I need to stop HTTP request, not just the transfer or visibility of the image.

And to ForestCroce, as far as I can tell, images in <noscript> are not indexed, and I wouldn't be surprised if text was not picked up either. I imagine the rationale behind this is that <noscript> hides stuff from the majority of users, since almost all users have JavaScript enabled. If the majority of users don't see it, then the search engine doesn't need to see it.

Originally Posted by frost

It also cannot use <noscript> because I want search engines to index it, and <noscript> is not picked up by search engines.

After some research, it seems to be that no images are requested by the normal search engine spiders, but they are requested by image spiders (hence Googlebot and Googlebot-Image). I don't see any proof that <noscript> is not picked up by search engines.

This makes my problem a whole lot easier: just use <noscript>! I just wanted to clarify that what I said was wrong in case some reads this thread in 3 years.