Question

我有一个网站，其中有一个包含3个部分的图库。每个部分最多包含30张图像。我会将图像存储在与相关部分相关的文件夹中（即“img / gallery / category1”，“img / gallery / category2”和“img / gallery / category3”）

基本上不是编写html来显示每个单独的图像，我希望有一个javascript循环，它将在文件夹中查看并显示每个图像，并将url放在预定义的代码片段中，即：

<div class="span4">
  <img src="img/gallery/category1/IMAGE-FILENAME1">
</div>

<div class="span4">
  <img src="img/gallery/category1/IMAGE-FILENAME2">
</div>

...等等，直到文件夹中的所有图像都被处理完......（另外，我知道上面的html我可能会更聪明一些，但我想要传达我希望每个找到的图像网址都坐下来在一段重复的代码片段中。）

我还在使用javascript进行培训，所以我想知道是否有办法可以做到这一点？

由于

Answer 1

Javascript不能通过iteself执行此操作...但是，如果您有XML或JSON格式的图像列表及其各自的位置，则可以使用ajax获取该文件，解析其内容并创建标记。

Answer 2

我找到了另一种解决方案。

我还没准备好解决AJAX，JSON或下面列出的任何问题。所以我决定考虑使用PHP。解决方案如下：

我首先使用以下内容转到并将文件夹的内容读取到数组：

$directory = "DIRECTORY"

$dirhandler = opendir($directory);

$nofiles=0;
while ($file = readdir($dirhandler)) {

if ($file != '.' && $file != '..')
{
  $nofiles++;
  $files[$nofiles]=$file;                
}}

然后使用foreach循环迭代数组，每次都回显引用找到的文件名的html输出。

完美无缺。

Answer 3

您无法直接从Javascript查看服务器上的目录。您可以对服务器进行AJAX调用以获取列表（使用XML或JSON），然后在循环响应时为每个文件创建并附加新的div。

动态地将文件夹中的图像添加到网站

3 个答案: