关于循环显示图片的问题
本帖最后由 wp231957 于 2020-1-8 15:41 编辑<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script>
var ims=['images/1111.png','images/2222.png','images/3333.png'];
var index=0;
function show(){
if (index >2){
index=0;
}
document.getElementById("me").src=ims;
index++;
setTimeout("show()",1000);
}
</script>
</head>
<body onload="show()">
<imgid="me"src="">
</body>
</html>
这个代码能够实现定时更换图片显示的效果,我的问题是:
var ims=['images/1111.png','images/2222.png','images/3333.png'];这个images目录下有很多png jpg 啥的,我如何能够自动获取这些图片名字,而不是像我代码中那样一个一个的写出来
Q:“我如何能够自动获取这些图片名字”
A:模版字符串 你这个问题超出了浏览器JS运行边界,浏览器中JS不能操作计算机内的文件,除非使用 input 元素上传文件,否则在JS脚本生命周期内都不可以超出浏览器去直接读写计算机内的文件,如果浏览器中JS可以操作到计算机文件目录这一层,那很多网站攻击你的电脑就太方便了,JS只能使用浏览器开放给它的接口,这些接口就是所谓的DOM BOM
你的需求是读取文件目录,将文件夹中的图片文件名生成相对地址保存在数组中,这个 NodeJS 做到很简单,但浏览器不行
let fs = require('fs');
let join= require('path').join;
function getJsonFiles(jsonPath) {
let jsonFiles = [];
function findJsonFile(path) {
let files = fs.readdirSync(path);
files.forEach(function (item, index) {
let fPath = join(path, item);
let stat = fs.statSync(fPath);
if (stat.isDirectory() === true) {
findJsonFile(fPath);
}
if (stat.isFile() === true) {
jsonFiles.push(fPath);
}
});
}
findJsonFile(jsonPath);
return jsonFiles;
}
let imagesPath = __dirname + '/images'; // 这里要与你 images 目录所在相同
console.log(getJsonFiles(imagesPath));
这个方法是之前用来查找文件下文件名及目录的,得到的数组中的值是文件名包含目录地址,你可以改改来用,但它必需在 Node 环境下执行。
在 Node 环境下执行该函数的最简单方法是你电脑安装好 Node, 然后用 vs code 编辑器打开文件,安装 run 插件,然后 ctrl + alt + n 就可以看结果了
陈立希2570 发表于 2020-1-9 11:33
你这个问题超出了浏览器JS运行边界,浏览器中JS不能操作计算机内的文件,除非使用 input 元素上传文件,否 ...
那网上很多网页都能“上一张”“下一张”这样循环往复的显示图片 那他们的图片名称(图片路径)都是写死的吗 有写死的,但一般不这么做
这是服务器代码运行之后已经生成好字符串格式的图片名称路径,也可以是发送请求服务套器返回过来的数据 写前端看效果写死就可以了,
页:
[1]