$(document).ready(function() vs. if () ??

Schon festgestellt? Dem Forum sind gerade alle Interaktionsmöglichkeiten genommen. :(

Mehr dazu unter: Abstimmung über das Forum

  • Hi,


    oich habe mal ein grundsätzliche Frage. In meiner .js arbeite ich mit:


    Code
    1. $(document).ready(function() {
    2.     ...
    3. }

    und an anderer Stelle mit:

    Code
    1. if (window.location.href.indexOf("seiteOffen1") > -1) {
    2. ...
    3. }

    beides funktioniert. Die Seite wird angezeigt und js arbeitet wie es soll.


    Worin lkiegt der Unterschied? Was ist richtig oder falsch? Wo kann mir das "auf die Füße fallen"?


    Kann mir das jemand kurz schildern?

  • Hallo, das eine ist JQuery und das andere reines JavaScript.


    Weißt Du was Bibliotheken sind? Also in einer Programmiersprache? Bibliotheken sind Sozusagen vereinfacherungen von Programmiersprachen. Sie leisten vorarbeit. Wenn Du also angenommen ein Spiel ohne Bibliotheken programmieren willst, musst du alles von anfang an definieren. Einen Charakter, oder einen Weg musst du von atomarer Basis an erstellen. Eine Bibliothek speziell für die Spieleentwicklung hat das aber bereits. Dann sagst du nicht mehr "Zelle auf Zelle auf Zelle" um dir mühsam einen Menschen zusammen zu basteln, sondern du sagst einfach nur "Charakter();" und dann hast Du deinen Charakter.


    JQuery ist eine solche Bibliothek für JavaScript, welche dazu da ist um Code zu verkürzen und diesen in jedem Browser ohne weiteres ausführbar zu machen. Der einzige Unterschied zwischen den zwei Varianten ist also nur, dass die obere für dich leichter und schneller geht und außerdem immer in jedem Browser funktioniert, weil das der Basiszweck von JQuery ist. Und gerade bei großen Anwendungen ist das wichtig.

  • Zunächst mal hat der erste Code mit dem zweiten gar nichts zu tun. Das eine ist ein Eventhandler, das andere eine Abfrage der location. Beide haben jeweils einen anderen Zweck.

    Code
    1. $(document).ready(function() {
    2.    ...
    3. }

    ist, wie DER schon geschrieben hat eine Funktionalität der jQuery Library. In reinem JavaScript sähe das Äquivalent bspw. so aus:

    Code
    1. document.addEventListener( 'DOMContentLoaded', function() {
    2.     ...
    3. });

    Das ganze ( egal, welche Variante ) sorgt lediglich dafür, dass alles innerhalb der function erst ausgeführt wird, wenn alle Elemente des Dokument geladen sind, das Dokument also vollständig ist. Damit wird verhindert, dass man bspw, nicht auf ein Element zugreift, das evtl. noch gar nicht geladen wurde, da HTML sequentiell von oben nach unten abgearbeitet wird.


    Worin lkiegt der Unterschied? Was ist richtig oder falsch? Wo kann mir das "auf die Füße fallen"?

    Wie gesagt hat das eine mit dem anderen nichts zu tun. Ob richtig oder falsch kann man aufgrund der paar gezeigten Zeilen nicht wirklich beantworten. Die zweite Variante macht für mich allgemein wenig Sinn, zumindest habe ich selber für so eine Abfrage noch keinen relevanten Fall gehabt.


    Auf die Füße fallen kann Dir das aus meiner Sicht nicht, da die location schon zur Verfügung steht, bevor das Dokument vollständig geladen ist.


    Ob jQuery nun so eine große Hilfe und Erleichterung ist, sehe ich persönlich etwas anders. Für mich ist jQuery absolut überbewertet und nur in schätzungsweise 5% aller Fälle evtl. notwendig ( Zahl einfach mal in den Raum geworfen! ). Die große Selektionsfähigkeit von jQuery ist bspw. mit ca. 3kB Scriptaufwand mindestens genauso gut reproduzierbar. Was Animationen angeht, die ich mit CSS3 nicht hinbekomme, da macht jQuery vielleicht Sinn. Aber wann habe ich den Fall mal...