0

我正在尝试创建一个包含 6 个图像、2 行和 3 列的大表。我在程序的头部为所有这些创建了一个数组。它应该在体内吗？表格中的图像稍后需要可点击，指向同一页面（即 google.com）。我不知道如何将图像单独放入我创建的表格中。

<head>
  <script>
    var img = new Array(6);
    img[0] = new (400,200)
    img[0].src"image1.jpg"
  </script
</head>

...对于所有其余的图像，依此类推

<body>
    <table border ="0">
    <tr>
    <td>document.write(img[0]) </td>
    </tr>
    </table>
</body>

...等等其余的图像

4

2 回答 2

4

您似乎忽略了 DRY - 不要重复自己。您正在为要创建的每个图像重复代码。相反，试试这个：

<script type="text/javascript">
    (function() {
        var images = [
            "image1.jpg",
            "photo.jpg",
            "graphic.png",
            "animation.gif"
        ], columns = 3,
        l = images.length, i,
        table = document.createElement('table'),
        tbody = table.appendChild(document.createElement('tbody')),
        tr, td, img;
        for( i=0; i<l; i++) {
            if( i % columns == 0) tr = tbody.appendChild(document.createElement('tr'));
            tr.appendChild(document.createElement('td'))
              .appendChild(document.createElement('img'))
              .src = images[i];
        }
        document.body.appendChild(table);
    })();
</script>

这基本上会在脚本所在的位置插入包含所有图像的表格。要添加更多图像，只需向数组添加更多 URL。要更改每行显示的数量，只需更改columns变量即可。此代码比您的原始代码更复杂，但另一方面，它更具可扩展性且更易于修改。

于 2012-06-25T22:47:47.507 回答
0

这是您可以做到的一种方法：

<td><img id="theImage" /></td>
<script>
 document.getElementById("theImage").src = img[0].src;
</script>
于 2012-06-25T22:46:58.733 回答