How to Check if an Image Exists on a Server Using JavaScript?

Verifying Image Existence on a Server with JavaScript

If you need to determine if a specific image is accessible on a server in a web page loaded with images 1.jpg to 5.jpg, JavaScript can be helpful.

Solution:

The following approach allows you to create a JavaScript function that checks for image existence every minute:

1. Utilize the XMLHttpRequest object:

   function imageExists(image_url){
    var http = new XMLHttpRequest();
    http.open('HEAD', image_url, false);
    http.send();
    return http.status != 404;
   }

This function makes an HTTP HEAD request to the image URL and checks whether the server responds with a 404 status, indicating the image does not exist.

2. Alternatively, use jQuery or another similar library:

   $.get(image_url)
    .done(function() { 
        // Perform some action if the image exists.
   
    }).fail(function() { 
        // Perform an alternative action if the image does not exist.
   
    })

Using the jQuery method, you can make an asynchronous GET request and specify different actions to be executed depending on the server's response.

By implementing one of these techniques, you can retrieve this information in your JavaScript code, allowing you to dynamically manage your image loading based on their availability on the server.

The above is the detailed content of How to Check if an Image Exists on a Server Using JavaScript?. For more information, please follow other related articles on the PHP Chinese website!