javascript - 我应该向不在某些页面上执行的 jQuery 添加 'if' 语句吗？

Question

我希望尽可能保持我的代码干净，我只是想知道在最佳实践方面解决这个问题的最佳方法是什么。

我有以下功能:

  $('.car-hub-header-help, #assistance-overlay').click(function(){
    $('#new-car-hub, #new-car-offer').toggleClass('assistance-active');
    $('#pulman-assistance').toggleClass('pulman-assistance-active').css("top", fixedPositionCalculator);
    $('#assistance-overlay').toggleClass('assistance-overlay-active');
    $('#new-car').toggleClass('assistance-active-body');
    $('#new-car-offer-cta').toggleClass('assistance-active-cta');
  });

现在您可以看到这个函数非常简单，它只是根据单击事件切换类。我遇到的一个问题是元素 new-car-offer-cta 仅在特定页面上，如果元素不存在，运行该部分功能似乎是一种不好的做法在我的一些页面上。

所以我只是想知道这是否是更好的做法:

  $('.car-hub-header-help, #assistance-overlay').click(function(){
    $('#new-car-hub, #new-car-offer').toggleClass('assistance-active');
    $('#pulman-assistance').toggleClass('pulman-assistance-active').css("top", fixedPositionCalculator);
    $('#assistance-overlay').toggleClass('assistance-overlay-active');
    $('#new-car').toggleClass('assistance-active-body');

    var carOfferCta = $('#new-car-offer-cta');
    if (carOfferCta.length) {
      carOfferCta.toggleClass('assistance-active-cta');
    };
  });

因此除非该元素在页面上，否则该部分函数将不会运行。我只是想知道什么是最佳实践。谢谢

Answer 1

我建议完全不要进行检查。 jQuery 的美妙之处在于，您通常不必知道您的选择器是否选择了 0 个、1 个或更多元素，这些方法就会正常工作(即使工作根本什么都不做)。

如果您开始在所有地方添加这些检查，您只是将逻辑的不同部分更紧密地耦合在一起。

(这也是为什么我通常不喜欢使用 id 选择器，而是选择基于类的原因。如果你的 html 发生变化，例如你的 jQuery 代码需要作用于更多元素，你不需要改变任何东西您的页面结构，只需应用正确的类。)