使用javascript(而不是php)将图像自动加载到html页面

load image automtacily to html page withe javascript(not php)

本文关键字:图像 加载 页面 html javascript php 使用      更新时间:2023-09-26

我需要用HTML构建一个库,并从本地目录加载图像。我不会使用PHP,只能使用JavaScript、HTML和CSS。

到目前为止,这是我的代码,但它不起作用。

$(document).ready(function() {
  var dir = "G:''Arml''Automation''System''Pic''test''"; // folder location
  var fileextension = ".jpg"; // image format
  var i = "1";
  $(function imageloop() {
    $("<img />").attr('src', dir + i + fileextension).appendTo(".testing");
    if (i == 10) {
      alert('loaded');
    } else {
      i++;
      imageloop();
    };
  });
});

1-您是否可以尝试用另一个名称更改变量dir,该名称可能被另一个javascript库使用

2-给出img的宽度和高度,例如:

$("<img width='100' height='50' />").attr('src', dir + i + fileextension ).appendTo(".testing");

这是javaScript的工作:

$(document).ready(function(){
        var dir = "path"; // folder location
        var fileextension = ".jpg"; // image format
        var i = "1";
        $(function imageloop(){
            $('.gallary').prepend('<li><a href="#"><img id="' + i + '" alt="description" /><img id="1' + i + '" alt="description" class="preview" /></a></li>')
                if (i==11){
                }
                else{
                $("#"+i).attr('src', dir + i + fileextension );
                $("#1"+i).attr('src', dir + i + fileextension );
                i++;
                    imageloop();
                };
        });   
    });