简单滚动 我可以干净地将一个类添加到多个其他类吗?

Simple scroll Can I add a class to multiple other classes cleanly?

本文关键字：添加 滚动 其他 一个 简单 我可以      更新时间：2023-09-26

我只是想知道是否有办法压缩这个脚本？我的 JS 非常粗糙，但似乎我应该能够插入一个 or 运算符将收缩类添加到任何通过的类中，但我似乎无法获得正确的语法。这似乎有很多冗余。

$(window).scroll(function() {
  if ($(document).scrollTop() > 50) {
    $('nav').addClass('shrink');
  } else {
    $('nav').removeClass('shrink');
  }
    if ($(document).scrollTop() > 50) {
    $('.nav a').addClass('shrink');
  } else {
    $('.nav a').removeClass('shrink');
  }
    if ($(document).scrollTop() > 50) {
    $('.navbar-brand').addClass('shrink');
  } else {
    $('.navbar-brand').removeClass('shrink');
  }
});

或者有没有办法将类添加到给定元素的所有子元素？ 

$(window).on('scroll', function() {
    $('nav, nav a, .navbar-brand').toggleClass('shrink', $(this).scrollTop() > 50);
});

使用 multiple 选择器定位所有匹配的元素，并切换 TClass 根据第二个参数（即"状态"）切换类。
this引用事件处理程序中的window，并且$(window).scrollTop()应该与 99.99% $(document).scrollTop()相同。

大概是这样的？

$(window).scroll(function() {
  if ($(document).scrollTop() > 50) {
       $('nav, .nav a, .navbar-brand').addClass('shrink');
    } 
  else {
       $('nav, .nav a, .navbar-brand').removeClass('shrink');
  }  
});

你可以试试： 

$(window).scroll(function() {
    if ($(document).scrollTop() > 50) {
        $('nav, .nav a, .navbar-brand').addClass('shrink');
    } else {
        $('nav, .nav a, .navbar-brand').removeClass('shrink');
    }
});

看看：https://api.jquery.com/multiple-selector/

相关文章：