jQuery和Javascript脚本之间的冲突

我有这两个脚本到我的网站。第一个脚本使#top部分在滚动出视口时淡出，而第二个脚本使#top根据一天中的时间更改其背景色

在我添加第二个脚本之前，第一个脚本工作得非常好

<script type="text/javascript">
$(document).ready(function () {
    $(window).scroll(function () {
        if ($(document).scrollTop() > 1) {
            $("#top").addClass("scrolled");
        } else {
            $("#top").removeClass("scrolled");
        }
    });
});
</script>


<script type="text/javascript">
  var now = new Date();
  var hours = now.getHours();

  // 1:00 AM to 6:00 AM
  if (hours > 1 && hours < 6) {
    document.getElementById("top").style.backgroundColor = "#feed9f"
  }
  // 7:00 AM to 12:00 PM
  else if (hours > 7 && hours < 12) {
    document.getElementById("top").style.backgroundColor = "#fee36c"
  }
  // 1:00 PM to 6:00 PM
  else if (hours > 13 && hours < 18) {
    document.getElementById("top").style.backgroundColor = "#fdda3a";
  }
  // 7:00 PM to 12:00 AM
  else if (hours > 19 && hours < 24) {
    document.getElementById("top").style.backgroundColor = "#fdd007";
  }
</script>

$（文档）.ready（函数（）{
$（窗口）。滚动（函数（）{
如果（$（文档）.scrollTop（）>1）{
$（“#top”）.addClass（“滚动”）；
}其他{
$（“#顶部”）.removeClass（“滚动”）；
        }
    });
});
var now=新日期（）；
var hours=now.getHours（）；
//凌晨1时至6时
如果（小时数>1和小时数<6）{
document.getElementById（“top”）.style.backgroundColor=“#feed9f”
}
//上午7时至下午12时
否则，如果（小时数>7小时和小时数<12小时）{
document.getElementById（“top”）.style.backgroundColor=“#fee36c”
}
//下午1时至6时
否则如果（小时数>13和小时数<18）{
document.getElementById（“top”）.style.backgroundColor=“#fdda3a”；
}
//下午七时至十二时
否则如果（小时数>19和小时数<24）{
document.getElementById（“top”）.style.backgroundColor=“#fdd007”；
}

---

目前，第一个脚本位于

中，而第二个脚本位于

的底部（仅此方式有效）。

到底出了什么问题？有什么事吗？是否报告了错误？如果脚本是这样写的，那么只有第二个脚本有效（因此页面会根据一天中的时间改变颜色，但在滚动时不会褪色）。您是否使用浏览器调试工具查看第一个脚本是否真的添加了类？第二个脚本中对

样式的更改可能会覆盖由第一个脚本操作的类的CSS规则。感谢您的建议，关于我刚刚添加的CSS！对我的.scrolled类很重要，现在两个脚本都可以完美地工作了！