0

我有一个问题需要帮助。我正在开发一个包含大量图像和视频的个人网页。标记是严格的 HTML,并使用 CSS 设置样式。我也有一个或两个 Javascript 正在运行。前几天我完成了我的第一页,刚刚意识到我必须手动添加大约 20-30 个图像/视频到每个页面(我希望构建大约 10-15 页),并认为也许有一些可用的脚本这可以简化我上传所有媒体内容的任务。请记住,所有页面看起来都一样,因此脚本确实会使事情变得更容易。

这是我的想法。我想我可以创建两个文件夹,将所有图像和视频添加到每个文件夹中。

然后使用 Javascript 遍历所有内容,将它们添加到我已经构建的 HTML 页面中。

这可能吗?如果是这样,请通知我如何获得此解决方案。

我不太了解 javascript,无法自己编写代码,因此我将不胜感激完整的解决方案。

这是HTML

<ul>
 <li><iframe width="420" height="345"src=""
</iframe></li>
</ul>

<ul>
<li><a href="#"><img src="" width=100 height=100/></a></li>
</ul>
4

2 回答 2

1

唯一的 javascript 解决方案是使用命名约定并让 javascript 假定应该有一个具有特定名称的项目。

一个例子是:

重命名您的文件:

PageName_1.jpg, PageName_2.jpg, PageName_3.jpg, PageName_1.flv, ...

缺点是您必须定义有关要查找的文件类型(扩展名)以及在每个页面上查找每种类型的数量的参数。

var files = {'jpg':3, 'flv':1, ...};
var pageName = "PageName";

完成设置后,您可以迭代对象:

for (var ext in files){
    for (var i = 0; i < files[ext]; i++){
        var src = "images/" + pageName + "_" + (i+1) + "." + ext;
        ...
    }
}

如果您想要的不仅仅是图像,则必须创建一些逻辑来确定要生成哪种类型的元素。解决此问题的最佳方法通常是工厂方法:

function generateElement(src, ext){
    switch(ext){
        case 'jpg':
            ...
        break;
        case 'flv':
            ...
        break;
    }
}

再说一次,您可以让您的生活更轻松并使用服务器端功能。

于 2012-10-12T22:22:09.323 回答
0

不幸的是,JavaScript 无法访问文件系统,因此它无法自动知道哪些文件可用。

就个人而言,我喜欢使用 PHP 5.4 的内置服务器来处理这类事情。PHP 很容易glob()将文件放入 HTML 页面中。

或者,您可以使用批处理脚本“编译”文件列表以供 JavaScript 读取:

dir /B *.png;*.gif;*.jpg > filelist.txt

然后,您可以使用 AJAX 或类似方式获取文件并将其拆分为换行符 - 每个文件将位于一行。这样,您所要做的就是运行批处理脚本来为您更新文件列表。

于 2012-10-12T22:08:50.733 回答