javascript - 将鼠标悬停在图像上时更改<td>背景颜色

我正在寻找本主题中描述的功能。当用户将鼠标悬停在图像（id =“ sie”）上时，表格单元格（id =“ sein_img”）的背景应更改。我尝试使用此代码，但不确定为什么它不起作用。帮助将不胜感激！

   <script type="text/javascript">
            document.getElementById("sein_img").onmouseover = function() {
                document.getElementById("sie").style.backgroundColor = "red";
            }
     </script>

 <td id="sie" style="background-color: #f3f5f7;">&nbsp;sie</td>

 <img id="sein_img" src="images/stories/bullet_white.png" />

最佳答案

您的脚本可以正常工作，但前提是您必须在受影响的HTML标记初始化后执行<script>（在您的情况下，其ID为<div>的sein_img）。该元素尚不可用，因此鼠标悬停侦听器未设置为该元素（通过document.getElementById()获得的元素为undefined。

因此，要解决您的问题，您可以选择以下两个选项：


将<script>标记移到页面底部，或者至少移到要设置侦听器的最后一个元素之后。
在将侦听器设置为元素之前，请等待文档准备就绪。您可以例如用jQuery（$(document).ready(function() { ... });）做到这一点

关于javascript - 将鼠标悬停在图像上时更改<td>背景颜色，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/38143330/