Javascript - 如何在表格中定位图像

时间:2017-11-10 08:48:42

标签: javascript image html4

我正在尝试将“随机”图像放入表格列中。基本上,我根据页面加载的第二个选择图像 - 所以有60个图像可用。图像选择并显示但位于页面边缘而不是表格边缘。

我要围成一圈。有关如何实现这一目标的任何提示吗?我用HTML4编写 - 我对HTML5知之甚少。图像宽度大小为480px,表格中的列宽为615px。

这是我的代码..一些调试已注释掉。

由于 马丁


    

简介

<script>

var d = new Date();
var n = d.getSeconds();
var n = "hdrimages/"+n+".jpg"
var img = document.createElement("img");
img.src = n

//document.getElementById("hdrimage").innerHTML = img.src;
//document.getElementById("hdrimage").style.cssFloat = "right";
//hdrimage.style.float = “right”;

document.body.appendChild(img);

</script>

</td>
<td width="40%" align="left" valign="top"> 
<h2>Upcoming Events</h2>
<hr>
<h2>News</h2></td>

3 个答案:

答案 0 :(得分:0)

这是因为您要将图像附加到正文而不是表格元素

答案 1 :(得分:0)

您可以执行以下操作

<table>
  <tr>
    <td id="img-cell"></td>
  </tr>
</table>

在JS部分你可以做到

document.getElementById('img-cell').appendChild(img);

答案 2 :(得分:0)

您当前的代码仅将图像添加到body标记的末尾。 您需要将图像添加到表格数据单元格标记中。 要做到这一点,给你的表数据单元格一个id,这样你就可以找到它,很容易添加:

<td id="myawesometabledatacell" width="40%" align="left" valign="top"> 
  <h2>Upcoming Events</h2>
  <hr>
  <h2>News</h2>
</td>

<script>
var d=new Date();
var n=d.getSeconds();
var n='hdrimages/'+n+'.jpg'
var img=document.createElement('img');
img.src=n
document.getElementById('myawesometabledatacell').appendChild(img);
</script>

我希望这会有所帮助。