Was passiert, wenn Sie zwei jQuery $(document).ready-Aufrufe in zwei JavaScript-Dateien haben, die auf derselben HTML-Seite verwendet werden?

Lesezeit: 4 Minuten

Benutzer-Avatar
Kopenhagen

Ich habe eine Frage zu jQuery $(document).ready

Nehmen wir an, wir haben eine HTML-Seite, die 2 enthält JavaScript Dateien

<script language="javascript" src="https://stackoverflow.com/questions/6435868/script1.js" ></script>
<script language="javascript" src="script2.js" ></script>

Nehmen wir nun an, in diesen beiden Skriptdateien haben wir $(document) folgendermaßen

Innen script1.js:

$(document).ready(function(){
    globalVar = 1;
})

Innen script2.js:

$(document).ready(function(){
    globalVar = 2;
})

Jetzt mein Fragen sind:

  1. Werden diese beiden Ready-Event-Funktionen ausgelöst?
  2. Wenn ja, in welcher Reihenfolge werden sie gefeuert, da das Dokument für beide gleichzeitig fertig sein wird?
  3. Ist dieser Ansatz empfehlenswert ODER sollten wir idealerweise nur 1 $(document).ready haben?
  4. Ist die Ausführungsreihenfolge in allen Browsern (IE, FF usw.) gleich?

Vielen Dank.

  • Sie werden in der Reihenfolge ausgeführt, in der Sie sie schreiben. Versuchen Sie, die globale Variable zu alarmieren, und Sie erhalten Ihre Antwort

    – Ibu

    22. Juni 2011 um 6:40 Uhr


  • @Ibu: Das wird ihm/ihr die Antwort auf den/die Browser geben, die er/sie in seinem/ihrem Test testet, was nicht dasselbe ist, als zu wissen, was es ist soll zu tun, browserübergreifend, in der realen Welt. Experimentieren ist gut, aber es hat Grenzen.

    – TJ Crowder

    22. Juni 2011 um 6:45 Uhr


Benutzer-Avatar
Shef

  1. Werden diese beiden Ready-Event-Funktionen ausgelöst?

Ja, sie werden beide gefeuert.

  1. In welcher Reihenfolge werden sie gefeuert, da das Dokument für beide gleichzeitig fertig sein wird?

In der Art, wie sie erscheinen (von oben nach unten), weil das ready-Ereignis einmal ausgelöst wird und alle Ereignis-Listener nacheinander benachrichtigt werden.

  1. Ist dieser Ansatz empfehlenswert ODER sollten wir idealerweise nur 1 $(document).ready haben?

Es ist in Ordnung, es so zu machen. Wenn Sie sie im selben Blockcode haben können, wäre es einfacher zu verwalten, aber das ist alles, was dazu gehört. Aktualisieren: Anscheinend habe ich vergessen zu erwähnen, dass Sie die Größe Ihres JavaScript-Codes erhöhen, wenn Sie dies in mehreren Dateien tun.

  1. Ist die Ausführungsreihenfolge in allen Browsern (IE, FF usw.) gleich?

Ja, denn jQuery übernimmt die browserübergreifende Normalisierung.

  • nette Antwort, nur ein kleiner Kommentar zu #3: es ist nicht in Ordnung.. selbst wenn möglich, sollten Sie Best Practices implementieren und sich nicht an schlechte Angewohnheiten gewöhnen. Ich kann mein Auto rückwärts fahren, aber ich würde es nicht immer tun 😉

    – Rafael Herscovici

    22. Juni 2011 um 7:41 Uhr

  • @Dementic: Ja, du hast recht, es ist die beste Vorgehensweise, es an einem Ort aufzubewahren. Hier gibt es jedoch Raum für Diskussionen, denn wenn er/sie zwei große Dateien hat und an einer Stelle eine davon laden muss und an einer anderen Stelle beide laden muss, dann ist das viel logischer ein paar Zeilen Dokument fertig zu haben, die auf beiden Dateien wiederholt werden, anstatt beide Dateien einzuschließen oder den logischen Fluss mit ifs und allem anderen Zeug zu verschmutzen.

    – Shef

    22. Juni 2011 um 7:54 Uhr

  • Ja und nein. Persönlich, in dem Fall, den Sie beschreiben (mit zwei oder mehr Dateien mit Onload-Funktionen), hätte ich eine andere js-Datei erstellt, die nur die Onload-Funktionen enthält.

    – Rafael Herscovici

    22. Juni 2011 um 8:03 Uhr

  • Mit einigen if-Anweisungen darin? Wenn ja, dann ist es so, wie ich es in meinem Kommentar oben beschrieben habe. Wie würden Sie sonst damit umgehen, was wann ausgeführt werden soll?

    – Shef

    22. Juni 2011 um 8:17 Uhr

Benutzer-Avatar
jensgram

Siehe hier: jQuery – ist es schlecht mehrere $(document).ready(function() {}); und hier: Tutorials:Mehrere $(document).ready()

  1. Ja
  2. Reihenfolge der Anbringung. jQuery intern unterhält a readyList mit Deferred Objekte.
  3. Es ist teilweise Geschmackssache. Haben eines ready handler gibt Ihnen einen schönen Überblick über alles, was passiert, während mehrere (d. h. eine pro enthaltener Datei) wird Ihren Code viel modularer machen (d. h. Sie können eine .js Datei und stellen Sie sicher, dass sie ihren eigenen Ready-Handler bereitstellt und bindet).
  4. Ja – Reihenfolge des Anhängens.

Benutzer-Avatar
David Ward

Sie können sich darauf verlassen, dass beide Handler in der Reihenfolge ihrer Skripteinbindung ausgeführt werden und globalVar Sein 2 nach dem zweiten Skriptverweis in jedem aktuellen Browser.

  • “in jedem aktuellen Browser” Oder in jedem anderen Browser ist es jQuery, das die Reihenfolge sicherstellt (wie bei allen Event-Handlern, die mit jQuery verbunden sind, um der Tatsache Rechnung zu tragen, dass Microsoft mit der Reihenfolge einen Weg gegangen ist und alle anderen den anderen.

    – TJ Crowder

    22. Juni 2011 um 6:43 Uhr

  • Jeder Browser, der zum Zeitpunkt des Schreibens derzeit von jQuery unterstützt wird.

    – David Ward

    22. Juni 2011 um 6:51 Uhr


Wenn Sie die volle Kontrolle wollen, empfehle ich nur dringend eines $(Dokument).ready();

Wenn Sie Teilbereiche von HTML durchladen ajax und die Ajax-Antwort enthält ein $(document).ready();-Skript und Sie möchten $(document).ready(); von script1.js, script2.js und so weiter in der Ajax-Rückruf.. Sie müssen VIEL Code duplizieren ….

Viel Glück!

/ $(Fenster).ready(); 😉

  1. Beide werden entlassen
  2. Der Wert der Variablen wird 2 sein, sobald sich der Staub gelegt hat.
  3. Die Hauptsache, die nicht empfohlen wird, ist die Verwendung von 2 verschiedenen JS-Dateien, wie Google PageSpeed ​​und Yahoo YSlow empfehlen, es ist am besten, alle Ihre Javascript-Codes in derselben Datei zu haben. Was die gleichen Event-Handler betrifft, sehe ich ehrlich gesagt keinen Grund, das zu tun, und es wird die Lesbarkeit Ihres Codes nur schlechter machen.
  4. Darauf habe ich keine Antwort.

1144030cookie-checkWas passiert, wenn Sie zwei jQuery $(document).ready-Aufrufe in zwei JavaScript-Dateien haben, die auf derselben HTML-Seite verwendet werden?

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy