Is there a way to return a list of all the image file names from a folder using only Javascript? Is there a way to return a list of all the image file names from a folder using only Javascript? jquery jquery

Is there a way to return a list of all the image file names from a folder using only Javascript?


No, you can't do this using Javascript alone. Client-side Javascript cannot read the contents of a directory the way I think you're asking about.

However, if you're able to add an index page to (or configure your web server to show an index page for) the images directory and you're serving the Javascript from the same server then you could make an AJAX call to fetch the index and then parse it.

i.e.

1) Enable indexes in Apache for the relevant directory on yoursite.com:

http://www.cyberciti.biz/faq/enabling-apache-file-directory-indexing/

2) Then fetch / parse it with jQuery. You'll have to work out how best to scrape the page and there's almost certainly a more efficient way of fetching the entire list, but an example:

$.ajax({  url: "http://yoursite.com/images/",  success: function(data){     $(data).find("td > a").each(function(){        // will loop through         alert("Found a file: " + $(this).attr("href"));     });  }});


This will list all jpg files in the folder you define under url: and append them to a div as a paragraph. Can do it with ul li as well.

$.ajax({  url: "YOUR FOLDER",  success: function(data){     $(data).find("a:contains(.jpg)").each(function(){        // will loop through         var images = $(this).attr("href");        $('<p></p>').html(images).appendTo('a div of your choice')     });  }});


No. JavaScript is a client-side technology and cannot do anything on the server. You could however use AJAX to call a server-side script (e.g. PHP) which could return the information you need.

If you want to use AJAX, the easiest way will be to utilise jQuery:

$.post("someScript.php", function(data) {   console.log(data); //"data" contains whatever someScript.php returned});