Javascript 使用js变量作为img src

我试图让js动态生成一个缩略图库，其中的div中包含标题和描述

我认为这可能是最好的，因为它会给我排序和分页。我使用他们的启动脚本尝试将变量放入正确的div中，但我一直遇到问题，尤其是在输出imgsrc时

我想使用别名作为文件名，在正确的路径中自动定位缩略图-例如，对于别名alias1，img src将是img/thumb/alias1.jpg。如何让javascript基于alias生成此路径并将其和其他变量插入正确的div中

这是我的密码。关于如何使这项工作，或者更好的解决方案，有什么想法吗

var选项={
ValueName:[“标题”、“别名”、“说明”、“url”、“图像”]，
项目：'

.hvrbox，
.hvrbox*{
框大小：边框框；
}
.hvrbox{
位置：相对位置；
显示：内联；
溢出：隐藏；
高度：自动；
宽度：100%；
}
.hvrbox标题{
位置：绝对位置；
背景色：rgba（0,0,0,0.5）；
保证金：0；
排名：0；
最小宽度：100%；
高度：自动；
最小高度：12%；
垫面：1.5%；
左：1.5%；
右侧填充：1.5%；
文本对齐：居中；
}
.hvrbox i{
位置：绝对位置；
底部：2%；
右：3%；
字号：3em；
颜色：#E6AA3C；
}
.hvrbox img{
宽度：100%；
}
.hvrbox文本a{
文字装饰：无；
颜色：#ffffff；
字号：700；
填充物：5px；
}
.hvrbox.hvrbox-layer_底部{
显示：块；
}
.hvrbox.hvrbox-layer\u顶部{
不透明度：0；
位置：绝对位置；
排名：0；
左：0；
右：0；
底部：0；
宽度：100%；
身高：100%；
背景：rgba（0,0,0,0.6）；
颜色：#fff；
填充：15px；
-moz转换：所有0.4都可以轻松地输入输出0；
-webkit过渡：所有0.4s都易于输入输出0；
-ms转换：所有0.4s易于输入输出0s；
过渡：所有0.4s均为0进0出；
}
.hvrbox:hover.hvrbox-layer_top，
.hvrbox.active.hvrbox-layer_-top{
不透明度：1；
}
.hvrbox.hvrbox文本{
文本对齐：居中；
字号：18px；
显示：内联块；
位置：绝对位置；
最高：50%；
左：50%；
宽度：75%；
-moz变换：平移（-50%，-50%）；
-webkit转换：翻译（-50%，-50%）；
-ms转换：翻译（-50%，-50%）；
转换：翻译（-50%，-50%）；
}
.hvrbox.hvrbox-text_mobile{
字体大小：15px；
边框顶部：1px实心rgb（179179179179）；
/*对于旧浏览器*/
边框顶部：1px实心rgba（1791791790.7）；
边缘顶部：5px；
垫顶：2件；
显示：无；
}
.hvrbox.active.hvrbox-text_mobile{
显示：块；
}
.hvrbox.hvrbox-layer\u slideup{
-moz变换：translateY（100%）；
-webkit转换：translateY（100%）；
-ms转换：translateY（100%）；
转化：translateY（100%）；
}
.hvrbox:hover.hvrbox-layer\u slideup，
.hvrbox.active.hvrbox-layer\u slideup{
-moz变换：translateY（0）；
-webkit转换：translateY（0）；
-ms变换：translateY（0）；
变换：translateY（0）；
}


我不能完全确定，因为我看不到文件结构，但假设js文件位于项目的根目录中（图像文件夹所在的文件夹），则需要将./附加到根变量中定义的文件路径的开头

我希望这是有道理的