Javascript 显示数组中的图像
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10122032/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Display images from an array
提问by Philipp Braun
I am trying to display six images from a javascript array. Running the code below I get no results it simply seems to be not working. I have no idea where my fault is.
我正在尝试从 javascript 数组中显示六个图像。运行下面的代码我没有得到任何结果，它似乎无法正常工作。我不知道我的错在哪里。
Here is the javascript code:
这是javascript代码：
var backgroundImage = new Array();
backgroundImage[0] = "images/colors-wallpaper.jpg";
backgroundImage[1] = "images/florida-birds.jpg";
backgroundImage[2] = "images/focus-on-life.jpg";
backgroundImage[3] = "images/set-into-life.jpg";
backgroundImage[4] = "images/dandelion.jpg";
backgroundImage[5] = "images/flowers.jpg";
backgroundImage[5] = "images/flowers.jpg";
function displayAllImages() {
// Here has to be some error!!! //
for (i=0;i<backgroundImage.length;i++) {
document.write("<li><img src='" + backgroundImage[i] + "' width="160" height="120"/><span>" + backgroundImage[i] + "</span></li>");
}
}
And that's my html code:
那是我的 html 代码：
<html>
<head>
<script type="text/javaScript" src="changebackground.js"></script>
</head>
<body>
<div id="container">
<div class="backgoundImage">
<ul>
<script>displayAllImages();</script>
</ul>
</div>
</div>
</body>
</html>
回答by SlavaNov
Change
改变
width="160" height="120"
to
到
width='160' height='120'
In
在
document.write("<li><img src='" + backgroundImage[i] + "' width="160" height="120"/><span>" + backgroundImage[i] + "</span></li>");
You are using wrong quotation marks
您使用了错误的引号
回答by GillesC
Your last array item key should be 6 (also I reckon as same value it's a copy/paste error) and I would strongly recommend against using document.write for such thing. Check link to see what I think you want to achieve but done in a slightly cleaner way (demo using jQuery just for the dom ready handling)
你的最后一个数组项键应该是 6（我也认为它是一个复制/粘贴错误），我强烈建议不要使用 document.write 做这样的事情。检查链接以查看我认为您想要实现的目标，但以更简洁的方式完成（使用 jQuery 的演示仅用于 dom 就绪处理）
回答by James Zaghini
You need to escape your double quotes, see below:
您需要转义双引号，请参见下文：
document.write("<li><img src='" + backgroundImage[i] + "' width=\"160\" height=\"120\"/><span>" + backgroundImage[i] + "</span></li>");
回答by Flops
document.write("<li><img src='" + backgroundImage[i] + "' width='160' height='120'/><span>" + backgroundImage[i] + "</span></li>");
You have a mistake in quotes. But better do not use document.write The beeter way is to create an element in memory, and then put it in this block. How it looks on jQuery
你在引号中有一个错误。但最好不要使用 document.write 更好的方法是在内存中创建一个元素，然后将其放入这个块中。它在jQuery 上的样子
