Sollte ich jQuery eine 'if'-Anweisung hinzufügen, die auf bestimmten Seiten nicht ausgeführt wird?

Question

Ich mag es, meinen Code so sauber wie möglich zu halten, und ich frage mich nur, was wäre der beste Weg, um dieses Problem zu umgehen, wenn es um Best Practices geht.

Ich habe die folgende Funktion:

$('.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'); 
    }); 

Nun, wie Sie diese Funktion sehr einfach sehen kann, ist es Klassen nur schaltet basierend auf einem Click-Ereignis. Ein Problem, das ich habe, ist, dass das Element new-car-offer-cta nur auf bestimmten Seiten ist und es scheint, dass es eine schlechte Übung ist, diesen Teil der Funktion auszuführen, wenn das Element nicht auf einigen meiner Seiten ist.

So frage ich mich nur, wenn dies eine bessere Praxis sei:

$('.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'); 
    }; 
    }); 

so dass ein Teil der Funktion wird nicht ausgeführt, wenn das Element auf der Seite. Ich frage mich nur, was als Best Practice gilt. Danke

Answer 1

jQuery bereits überprüft das für Sie, wenn der Selektor innerhalb $() keine Elemente entspricht, die Funktionen, die Sie daran ketten nichts tun (nicht sogar einen Fehler erzeugen). Es gibt also wirklich keine Notwendigkeit, explizit zu überprüfen. Mit diesen Ausnahmen:

• wenn Sie wollen es absolut klar, jemand Ihren Code zu lesen, dass das Element Sie versuchen, nicht zu erstellen, die auf jeder Seite existieren, die Ihr Skript verwendet oder
• , wenn Sie Möchten Sie eine Menge verschiedener Dinge in Ihrer if-Anweisung,

tun, dann ist es sinnvoll, if ($element.length) explizit zu schreiben.

Answer 2

Es ist besser zu fragen, ob das val des vals! = Undefined ist, anstatt nach der Länge zu fragen, da du davon ausgehst, dass es auf der Seite existiert. Sie können die Längenprüfung direkt nach dem zu fragen für die Existenz des Elements hinzuzufügen, kann ich in der Regel wie folgt:

if($('#new-car-offer-cta').val() != undefined && $('#new-car-offer').val().length > 0){ //do something }

Answer 3

ich gegen tun die Prüfung überhaupt raten würde. Das Schöne an jQuery ist, dass Sie normalerweise nicht wissen müssen, ob Ihr Selektor 0, 1 oder mehr Elemente auswählt, die Methoden werden einfach funktionieren (auch wenn die Arbeit gar nichts tut).

Wenn Sie beginnen, diese Überprüfungen überall hinzuzufügen, verbinden Sie nur verschiedene Teile Ihrer Logik enger miteinander.

(Das ist auch der Grund, warum ich normalerweise keine ID-Selektoren verwende, sondern stattdessen basierend auf Klassen. Wenn sich dann Ihr HTML ändert und zB Ihr jQuery-Code auf mehr Elemente reagieren muss, müssen Sie nichts ändern die Struktur Ihrer Seite, wenden Sie nur die richtigen Klassen.)