通过Javascript中的添加/删除类更改图像。在初始页面滚动=0时如何？

当用户从黑色背景滚动到浅色背景时，我正在尝试更改标题徽标。我让add/remove类正常工作，但是当用户加载页面时，图像不会显示，因为它在滚动大于0像素时执行。如何在用户没有滚动的情况下显示页面加载的初始条件

$(function() {
  var header = $(".logo");
  var about = $(".angle").offset().top;;
  $(window).scroll(function() {    
       var scroll = $(window).scrollTop();
       if (scroll >= about) {
          header.removeClass('lightLogo').addClass('darkLogo');
       } else {
          header.removeClass('darkLogo').addClass('lightLogo');
       }
    });   
});

---

最简单的方法可能是最初添加类，如下所示：

$(function() {
  var header = $(".logo").addClass('lightLogo');
  var about = $(".angle").offset().top;;
  $(window).scroll(function() {    
       var scroll = $(window).scrollTop();
       if (scroll >= about) {
          header.removeClass('lightLogo').addClass('darkLogo');
       } else {
          header.removeClass('darkLogo').addClass('lightLogo');
       }
   });   
});

---

现在，页面加载时标题将以.lightLogo开头。

为什么不在HTML中的标题上添加“lightLogo”类，这样就可以开始了？嗯，我试过了，但是不管我添加或删除类，它都无法更改为新图像。如果您只添加darkLogo类，您与lightLogo类存在冲突，因此无论哪个选择器具有优先权，都将获胜。你可以（1）在添加另一个类时去掉一个类，或者（2）只使用一个类并切换它，或者（3）将默认值设置为lightLogo中的值，只使用一个darkLogo类来覆盖它。嗯，有什么代码可以帮我覆盖它吗？我给出了一个答案，可能是最简单的方法，就是最初通过一个类名来添加它。如果不行，请告诉我。太好了！啊，这么简单的添加。我不熟悉javascript，但谢谢您的帮助。我从逻辑加法中学到了很多东西，这一点让我印象深刻。非常感谢。我还有一个问题你可以帮我解决。我目前正在使用添加/删除功能，当用户滚动经过某个div时，该div取决于他们启动页面的窗口大小。不幸的是，如果他们调整浏览器的大小，它添加/删除的点就不再与div链接。他们必须刷新页面才能匹配。无论用户如何调整大小，我都可以使此函数再次出现吗？您可以使用jQuery“on”而不是“scroll”来运行多个事件的函数：$（窗口）。on（'scroll resize'，function（））{…太好了，我需要更改函数的其余部分还是只添加它？我尝试过这样做，但在调整大小和它的调整方面运气不佳。您可能需要在事件处理程序中移动“about”的计算，因为对于调整大小键，它的值可能已更改。