gpt4 book ai didi

javascript - 如何在 Javascript 中随机移动表格周围的图像

转载 作者:行者123 更新时间:2023-11-30 12:01:50 24 4
gpt4 key购买 nike

我在表格的单元格中有一张图片,我希望它从一个单元格随机移动到另一个单元格。我计划使用 setInterval 和 Math.random() 每两秒随机移动一次图像,但我根本无法让图像移动

<html>
<head>
<style>
tr { width: 300px; height: 100px }
td { width: 100px; height: 100px }
img { width: 100px; height: 100px }
</style>
<script>
function moveImgRandomly()
{


}
</script>
</head>
<body bgcolor="lightblue">
<table border=1 id="myTable">
<tr>
<td></td>
<td></td>
<td><img src="http://graemehobbs93.files.wordpress.com/2012/01/ape-1.jpg" id="img"></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</body>

这是我目前所拥有的有效方法。我已经尝试了几个小时让图像移动,但它不会。我也不能使用 jQuery。

最佳答案

应该这样做。

var img = document.getElementById("img");
var tds = document.getElementsByTagName("td");

setInterval(function(){
var randomNumber = Math.floor(Math.random() * tds.length);
tds[randomNumber].appendChild(img);
}, 2000);
tr { width: 300px; height: 100px }
td { width: 100px; height: 100px }
img { width: 100px; height: 100px }
<body bgcolor="lightblue">
<table border=1 id="myTable">
<tr>
<td></td>
<td></td>
<td><img src="http://graemehobbs93.files.wordpress.com/2012/01/ape-1.jpg" id="img"></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</body>

关于javascript - 如何在 Javascript 中随机移动表格周围的图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36452236/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com