在本地主机和实时服务器上都可以正常工作，并且允许您扩展允许的文件扩展名的分隔列表：

var folder = "images/";

$.ajax({
    url : folder,
    success: function (data) {
        $(data).find("a").attr("href", function (i, val) {
            if( val.match(/\.(jpe?g|png|gif)$/) ) { 
                $("body").append( "<img src='"+ folder + val +"'>" );
            } 
        });
    }
});

注意

Option Indexes默认情况下，Apache服务器已打开 - 如果您使用另一台服务器，例如Express for Node，您可以使用此 NPM 包使上述工作正常工作：https : //github.com/expressjs/serve-index

如果要列出的文件/images不在 server.js 中，则可以添加如下内容：

const express = require('express');
const app = express();
const path = require('path');

// Allow assets directory listings
const serveIndex = require('serve-index'); 
app.use('/images', serveIndex(path.join(__dirname, '/images')));

利用 ：

var dir = "Src/themes/base/images/";
var fileextension = ".png";
$.ajax({
    //This will retrieve the contents of the folder if the folder is configured as 'browsable'
    url: dir,
    success: function (data) {
        //List all .png file names in the page
        $(data).find("a:contains(" + fileextension + ")").each(function () {
            var filename = this.href.replace(window.location.host, "").replace("http://", "");
            $("body").append("<img src='" + dir + filename + "'>");
        });
    }
});

如果您有其他扩展名，您可以将其设为一个数组，然后使用in_array().

ps：以上源码未经测试。

这是添加更多文件扩展名的方法，在本页顶部 Roy MJ 给出的示例中。

var fileextension = [".png", ".jpg"];
$(data).find("a:contains(" + (fileextension[0]) + "), a:contains(" + (fileextension[1]) + ")").each(function () { // here comes the rest of the function made by Roy M J   

在这个例子中，我添加了更多的包含。

这是一种方法。也涉及做一点 PHP。

PHP部分：

$filenameArray = [];

$handle = opendir(dirname(realpath(__FILE__)).'/images/');
        while($file = readdir($handle)){
            if($file !== '.' && $file !== '..'){
                array_push($filenameArray, "images/$file");
            }
        }

echo json_encode($filenameArray);

jQuery 部分：

$.ajax({
            url: "getImages.php",
            dataType: "json",
            success: function (data) {

                $.each(data, function(i,filename) {
                    $('#imageDiv').prepend('<img src="'+ filename +'"><br>');
                });
            }
        });

所以基本上你做一个 PHP 文件以将图像文件名列表返回为 JSON，使用 ajax 调用获取该 JSON，并将它们添加/附加到 html。您可能想要过滤从文件夹中抓取的文件。

从1开始对 php 部分有一些帮助

如果有兴趣在没有 jQuery 的情况下执行此操作 - 这是目前最受好评的答案的纯 JS 变体（来自此处）：

var xhr = new XMLHttpRequest();
xhr.open("GET", "/img", true);
xhr.responseType = 'document';
xhr.onload = () => {
  if (xhr.status === 200) {
    var elements = xhr.response.getElementsByTagName("a");
    for (x of elements) {
      if ( x.href.match(/\.(jpe?g|png|gif)$/) ) { 
          let img = document.createElement("img");
          img.src = x.href;
          document.body.appendChild(img);
      } 
    };
  } 
  else {
    alert('Request failed. Returned status of ' + xhr.status);
  }
}
xhr.send()