Question

我有一个包含缩略图的文件夹。这些可以是.jpg或.gif或.png等。如何使用javascript选择仅包含名称的文件？

例如，如果有一个名为 tree.jpg 的文件，我想仅使用树找到它。这些缩略图所在的文件夹始终相同。以下是我正在使用的代码段。我的问题是关于 var src 的行。在该行中，我希望仅使用名称在缩略图文件夹中找到该文件。

(projects is a json file)
function buildWork(projects) {
 var container = document.getElementById('projects');
 var row = document.createElement('div');
 row.className = 'row no-gutters';
 container.appendChild(row);

for(var i in projects) {
  col = document.createElement('div');
  col.className = 'col-6 col-md-4 item thumbnail';

  var src = "thumbnails/" + project.name;

  col.innerHTML = '<img src='+ src +'></img>';
  row.appendChild(col);
}

}

Answer 1

浏览器中的JavaScript不允许列出硬盘上的文件。如果您想针对服务器的文件系统尝试几个已知的文件扩展名，可以使用：

const fname = "tree";
const exts = ['.png', '.jpg', ... ];

let queries = exts.map(ext => fetch(`${fname}${ext}`).then(response));

Promise.all(queries).then(responses => {
    // Only one response will return "ok":
    // It will be at the same index as the correct extension
    // in the `exts` array.

    // This will hold the extension of the FIRST extension that returns
    // from the server successfully:
    let correctExtension = exts[responses.map(r => r.ok).indexOf(true)];

    let trueFileName = fname + correctExtension;
});

[编辑] 此方法仍适用于您更新的问题;但是，您仍在从服务器请求每个文件，并希望其中一个存在。（trueFileName var将在结尾处保留tree.jpg，前提是该文件存在于服务器上。）

您的另一个选择是在HTTP服务器上使用API样式的重定向;但这是完全不同的故事并且对您的JavaScript没有任何影响。

选择一个文件而不在javascript中指定扩展名

1 个答案: