我如何在网页上上传图像，并首先出现最新图像？答案

【问题标题】：How do i make images upload on web page with latest image appearing first?我如何在网页上上传图像，并首先出现最新图像？
【发布时间】：2014-06-05 21:18:43
【问题描述】：

我正在尝试创建一个可以上传新图像的网页，该网页将在其余图像之前在页面左上角更新，其他图像将向右移动一个空间（例如在个人资料上Instagram 上的页面）。我发现它可以与 unshift()（如下）一起使用，并且将保持在网页的边界内。但是，由于逗号，它在图像之间留下了间隙，我希望将图像拼凑在一起，以便它们在所有 4 个边缘彼此齐平（它看起来像一个由许多方形图像组成的大矩形）我一直在尝试整天为它写代码，但无济于事。有人可以帮忙吗？非常感谢。

<HTML>
<body>

<body onload="myfunction()">

<div class="content" id="content"></div>

<script>
var x = ["<img src=image1.jpg>", "<img src=image2.jpg>", "<img src=image3.jpg>", "<img src=image4>"];
document.getElementById("content").innerHTML = x;

function myfunction() {
    x.unshift("<img src=image5>", "<img src=image6>");
    document.getElementById("content").innerHTML = x;
}
</script>

</body>
</HTML>

【问题讨论】：

可能需要对其进行一些造型以摆脱空间
如果你希望它被维持，最好的方法是通过数据库，但就间距而言，我只是用 CSS 修复它。尝试将每个图像放入没有填充/边距的跨度类中，并通过 jQuery 设置 css。
谢谢，我去试试。

标签： jquery html css image instagram

【解决方案1】：

使用加入javascript函数（参考this）

http://jsfiddle.net/7z5dL/1/

var x = ["<img src=image1.jpg>", "<img src=image2.jpg>", "<img src=image3.jpg>", "<img src=image4>"];
document.getElementById("content").innerHTML = x.join("");;

function myfunction() {
    x.unshift("<img src=image5>", "<img src=image6>");
    document.getElementById("content").innerHTML = x.join("");
}

【讨论】：