Function Library

[LeeU]

Ah, read my mind. That's where I was going to point to. Thanks!

I forgot this thread was here. Some good stuff to share with others.

[Declan1991]

I don't know if you want these types, but here are three that I use all the time.

document.getElementsByClassName = function(className,tagName) {
    if (!document.getElementsByTagName) {
        return false;
    }
    var elements = document.getElementsByTagName(tagName||"*");
    var length = elements.length;
    var classElements = new Array();
    for (var i = 0; i < length; i++) {
        if (elements[i].className.match(className)) {
            classElements[classElements.length]=elements[i];
        }
    }
    return (classElements.length>0)?classElements:false;
}
window.addOnloadEvent = function(addToOnload) {
    var oldOnload;
    if (window.onload) {
        oldOnload = window.onload;
        window.onload = function(){
            oldOnload();
            addToOnload();
        };
    }
    else {
        window.onload = addToOnload;
    }
}
window.addElementOnload = function(elementId,onloadFunction) {
    if (document.getElementById && document.getElementById(elementId) != null) {
        onloadFunction();
    }
    else {
        setTimeout("window.addElementOnload('"+elementId+"',"+onloadFunction+");",50);
    }
} 

[Scriptage]

Short and simple script to replace the images on a web page with a text node containing their alternate text if images have been disabled.

<script type="text/javascript">

// Try to load a small image

var testImage = new Image;
testImage.src = "testimage.jpg";

onload = function(){

   if(!testImage.complete){

   // If the image has not loaded the user has disabled images in the browser
   // Find all of the images on the web page

   var documentImages = document.getElementsByTagName("img");
   
     for(var i=0; i<documentImages.length; i++){

     // Create and insert a text node after the image using the image's alternate text

     var replacementText = document.createTextNode(documentImages[i].alt);
     documentImages[i].parentNode.insertBefore(replacementText, documentImages[i]);

     // Hide the image

     documentImages[i].style.display = "none";

     }

   }

}

</script> 

[Fang]

Short and simple script to replace the images on a web page with a text node containing their alternate text if images have been disabled.

That is what the alt attribute is for: http://www.cs.tut.fi/~jkorpela/html/alt.html

[Scriptage]

That is what the alt attribute is for: http://www.cs.tut.fi/~jkorpela/html/alt.html

No it isn't. This replaces the image with a text node; run the code without the test image and you will see the distinct difference. You could also use the following code to degrade an image based menu into a completely text based menu.

<script type="text/javascript"> 

// Try to load a small image 

var testImage = new Image; 
testImage.src = "testimage.jpg"; 

onload = function(){ 

   if(!testImage.complete){ 

   // If the image has not loaded the user has disabled images in the browser 
   // Find all of the images on the web page 

   var documentImages = document.getElementsByTagName("img"); 
    
     for(var i=0; i<documentImages.length; i++){ 

     // Create and insert a text node after the image using the image's alternate text 

           if(documentImages[i].className == "menu"){
    
           var replacementText = document.createTextNode(documentImages[i].alt); 
           documentImages[i].parentNode.insertBefore(replacementText, documentImages[i]); 

           // Hide the image 

           documentImages[i].style.display = "none"; 

        }

     } 

   } 

} 

</script> 

[Fang]

If images have been disabled the user will see the alt value, try it and see.
Anyone with images disabled will almost certainly have JavaScript disabled.

[Scriptage]

If images have been disabled the user will see the alt value, try it and see.
Anyone with images disabled will almost certainly have JavaScript disabled.

Yes I know they see the alt value but they also see a box around the image and a cross; I sometimes browse with Javascript enabled and images off, I'm sure other people do aswell, especially in low bandwidth environments; I would be interested in seeing any explicit proof that people with images disabled do not have Javascript enabled.

[Fang]

Yes I know they see the alt value but they also see a box around the image and a cross

Only with IE and it indicates that there is more visual information.