jquery - 为什么这个 mouseover jquery 代码不起作用？

Question

我在网站的头部区域使用以下代码(我也尝试过正文):

<script>
 $(document).ready(function() {
  $(function(){
    $("#h1").mouseover(function () {
    $("#h1").css("color","red");
  });
  });
  });
</script>

我也使用它作为 div(按钮):

<div class="button" id="h1"><strong>Home</strong></div>

为什么当我将鼠标悬停在字体上时，字体没有变成红色？ (原色为白色仅供引用)

Answer 1

在内联脚本代码运行时，jQuery 尚未找到任何可将鼠标悬停绑定(bind)到的结果。

您需要将内联脚本包装在 document.ready 调用中，如下所示:

$(document).ready(function() {
    $("#h1").mouseover(function () {
       $("#h1").css("color","red");
    });
});

Ready about jQuery's ready function