Question

我有以下数组：

function theMiddle(){
var arrayTheMiddle = new Array (showName.theMiddle  +"<br />" + beginingTime.theMiddle  +"  <br    />" + network.abc  +"<br />" + duration.thirty  +"<br />" + rating.general  +"<br />" +    description.theMiddle  +"<br />" + showImagetheMiddle);
 document.getElementById("gridbar").innerHTML=(arrayTheMiddle);
 }

该数组中的最后一个对象showImagetheMiddle是一个包含以下代码的图像：

 var showImagetheMiddle = new Image();
 showImagetheMiddle.src = 'abc.jpg';

我的所有对象都显示在我的网页上，但showImagetheMiddle给出了以下错误：

[object HTMLImageElement]

我环顾四周但发现了更复杂的图像显示方式，我想保持简单并在现有数组中添加图像（如上图所示）。这可能吗？如果不是我在这里做错了什么？

非常感谢任何帮助！

Answer 1

由于arrayTheMiddle是数组，因此需要使用下标运算符[]从中获取元素。在您的示例中，图像是数组中的第一个（第0个）元素。你的行应该是这样的：

document.getElementById("gridbar").innerHTML = arrayTheMiddle[0];

作为旁注，使用方括号表示法[]（而不是下标运算符）创建数组要好得多。

var arrayTheMiddle = [ ... ];

编辑：看到您的评论后，我现在建议您使用.appendChild将元素插入到文档中。因为简单地追加+将无法按预期方式运作。这是你的代码：

var arrayTheMiddle = [showName.theMiddle  +"<br />" + beginingTime.theMiddle  +"  <br    />" + network.abc  +"<br />" + duration.thirty  +"<br />" + rating.general  +"<br />" +    description.theMiddle  +"<br />"];

document.getElementById("gridbar").innerHTML = arrayTheMiddle[0];
document.getElementById("gridbar").appendChild( showImagetheMiddle );

我在你的代码中发现了一些误解。例如，我认为您不了解数组的工作原理。所以这里有一些信息：

语法：

使用方括号表示法[]创建数组元素。数组的元素由逗号运算符,分隔。例如：

var l = [ 5, 3, 5, 6 ];

数组元素仅以逗号分隔。 +运算符不会将它们分开。所以这里是有效的代码，但数组中只有一个元素：

var l = [ 5 + 3 + 5 + 6 ];

在您的代码示例中，数组是多余的。没有它，你可以很好地做你需要的。所以这是你的新代码：

function theMiddle() {
    var arrayTheMiddle = ; // the same without '[' and ']'
    document.getElementById("gridbar").innerHTML= arrayTheMiddle;
    document.getElementById("gridbar").appendChild( showImagetheMiddle );
}

JavaScript无法在Array中显示Image

1 个答案:

语法：