Question

我尝试使用document.write()从我的阵列中写一个图像。但它没有显示任何......

// *** Temporal variables
    var i = 0;
    var j = 0;
    var x = 0;

    // Create basic linear array
    var ImgArray = []

    // Do the 2D array for each or the linear array slots
    for (i=0; i < 4 ; i++) {
        ImgArray[i] = []
    }

    // Load the images
    x = 0;
    for(i=0; i < 4 ; i++) { 
        for(j=0; j < 4 ; j++) { 
          ImgArray[i][j] = new Image();
          ImgArray[i][j] = "Images/" + x + ".jpg";
          document.write("<img id= " + x + " img src=ImgArray[i][j]  width='120'   height='120'/>");
          x = x + 1;
        }
        document.write("<br>");
    }

我做错了什么？

Answer 1

看起来你的JavaScript不太正确......

document.write('<img id="' + x + '" src="' + ImgArray[i][j] + '" width="120" height="120"/>');

Answer 2

document.write将任何输入写入脚本元素的位置。试试这个：

身体

<div id="imageContainer"></div>

在脚本中

，将所有输出收集到变量，比如contentVariable，然后

document.getElementById("imageContainer").innerHTML = contentVariable;

注意：

使用document.write甚至innertml将元素附加到dom是不好的做法。使用document.createElement和element.appendChild进行dom manupilation。

Answer 3

看起来您正在尝试使用new Image()进行图片预加载，但之后您立即使用src写出具有相同document.write()的图片元素，因此图片将会没有预装，你没有任何好处。我还怀疑你在内循环的一行上错过.src：

ImgArray[i][j].src = "Images/" + x + ".jpg";

创建图像元素的循环最好在生成HTML时在服务器端完成，但假设不是一个选项，则可能完全丢失ImgArray变量：

x = 0;
for(i=0; i < 4; i++) { 
    for(j=0; j < 4; j++) { 
        document.write("<img id='" + x + "' src='Images/" + x + ".jpg' width='120' height='120'>");
        x = x + 1;
    }
    document.write("<br>");
}

“document.write（）”问题与JavaScript中的图像数组有关

3 个答案:

注意：