Halten Sie meinen jQuery-Code von den HTML-Dateien entfernt

Ich lerne jQuery und habe mehrere Plugins erstellt. Leider aufgrund der Codierung Praktiken meiner Firma wollen sie alle Javascript-Code zu js-Dateien extrahiert werden. Dies für mich stellt zwei Herausforderungen:Halten Sie meinen jQuery-Code von den HTML-Dateien entfernt

Kann ich den tatsächlichen $ (Dokument) .ready (..) Aufruf in eine js-Datei extrahieren? Bisher habe ich mit meinem begrenzten Wissen nicht geahnt, ob dies überhaupt möglich ist. Wenn nicht, begrüße ich alle Vorschläge, um diesen Code sauberer und akzeptabler zu machen.
Es gibt zu viele Javascript-Includes für jeden asp.net-Seitenkopf, da ich möglicherweise mehrere Plugins verwende. Gibt es eine Möglichkeit, die potenziell kostspieligen Server-Trips zu reduzieren, die ich jedes Mal machen müsste, wenn ich diese Dateien benötige?

Alle Vorschläge werden Korrekturen sehr geschätzt

dank

Quelle

2009-06-18 chris lekkas

die Anzahl der Anfragen zu minimieren, verwende ich einen Handler mehrere Javascript-Dateien zu kombinieren und komprimieren. Dies ist das Beste aus beiden Welten. Sehen Sie es live in Aktion bei http://www.vizslapup.com –

Ich würde sagen, es ist ein Glück, dass Ihre Firma die js in separate Dateien extrahieren will. Es bedeutet eine saubere Trennung von Anliegen und es kann auch clientseitig zwischengespeichert werden. – Alex

Hallo Alex, Ja, Sie haben Recht, dass es eine ausgezeichnete Praxis ist, dies zu tun, und es ist ein Glück. Ich meinte den "unglücklichen" Aspekt meiner derzeitigen misslichen Lage. Dank –

1. Absolut.

einfach ein Skript Bezug auf Ihre html wie folgt hinzu:

<script type='text/javascript' src='js/yourfile.js'></script>

Dann starten Sie einfach Ihre Js mit

jQuery(function() { 
    foo; 
    ... 
    bar; 
});

oder andere Abkürzung Wege-Datei den Block jQuery-Code zu starten.

2. Sie sollten Ihre Skripts durch etwas wie Minify ausführen, bevor Sie sie an den Benutzer senden. Dadurch werden die Dateien kombiniert und schön verpackt, so dass sie weniger Platz einnehmen.

Quelle

2009-06-18 16:34:17

danke für deinen Ratschlag, werde Minify sicher versuchen. –

Ich denke, Sorgen über Server Reisen für Javascript umfasst ist vorzeitige Optimierung. Haben Sie Beweise dafür, dass diese Seiten langsam geladen werden? Der Browser sollte die Javascript-Dateien zwischenspeichern.

Wenn Sie Beweise haben, dass dies ein Problem, man konnte

Mähdreschernahrung der jQuery-Code und alle Plug-ins in eine Datei
-write einer .net Content-Handler dies für Sie tun (wahrscheinlich übertrieben)

Dann können Sie eine benutzerdefinierte js-Datei pro Seite hinzufügen, um seitenspezifische Eigenschaften zu behandeln.

Quelle

2009-06-18 16:36:00

Danke Tim, alle Ihre Antworten haben mir eine große Anleitung und Einblick gegeben. –

Sie können Ihre document.ready und alle anderen JavaScript-Code auf jeden Fall in eine externe Datei einfügen.

Normalerweise habe ich zwei Aufrufe - eine für jQuery selbst und eine minimierte global.js Datei, die alle meine einzelnen Dateien kombiniert und minimiert.

Persönlich möchte ich front end blender dafür verwenden, aber es gibt viele andere Optionen auch verfügbar.

Quelle

2009-06-18 16:37:46

Dank Mark, Will Front-End Mixer versuchen und minify wie durch Artem –

gibt es nichts falsch wit setzen document.ready Aufruf in einer externen Datei. In der Tat ist es das, was ich tue, um meine js von meinem HTML zu trennen.Wenn Sie besorgt über bestimmte Funktionen laufen auf bestimmten Seiten, können Sie durch sie sichten mit einem

var path = window.location.pathname; 
if (path == "/yourdir/yourpage.html") { 
    //do something for this page only 
}

oder Sie können einfach schließen bestimmte Dateien nur auf bestimmten Seiten.

Quelle

2009-06-18 16:43:34 Jason

Dank Jason, Wie Ihr Vorschlag über die Logik über die Seite spezifischen Code seperation –

ich es vorschlagen war verwenden :) für mich sehr gut funktioniert! Eine gute Möglichkeit, schnell herauszufinden, auf welcher Seite Sie gerade sind, ist, etwas wie Alarm (Pfad) zu tun; – Jason

Verwendung von $ (Dokument) .ready() in einer externen Javascript-Datei ist in Ordnung - es wird genau das gleiche funktionieren :) In der Tat - es wird nicht nur funktionieren, aber es ist eine gute Übung, da es hilft, den Inhalt zu trennen (HTML) aus dem Verhalten (Javascript).

Als Antwort auf Ihre Frage Abschnitt - Sie können alle Ihre Plugins in eine einzige Javascript-Datei und einen Link zu diesem innerhalb der <Kopf>. Sie könnten auch versuchen, die Skripte zu minimieren, obwohl dies normalerweise ein bisschen zu viel ist, bis die Seite online geht.

Wenn ich jQuery verwenden, die ich normalerweise diese Art von Struktur verwenden:

<html> 
    <head> 
    <!-- html tags such as title, link, meta etc --> 
    <script type="text/javascript" src="/path/to/jquery.js"></script> 
    <script type="text/javascript" src="/path/to/plugin.js"></script> 
    <!-- more plugins included if required --> 
    </head> 
    <body> 
    <!-- html here --> 

    <!-- script is the last thing before the ending body tag (increases performance) --> 
    <script type="text/javascript" src="/path/to/your_jQuery_code.js"></script> 
    </body> 
</html>

Quelle

2009-06-18 16:45:35 iblamefish

Hallo vielen Dank für die tollen Tipps, die Sie in Ihrer Antwort enthalten. Besonders gefällt mir der Performance-Tipp, der das Skript am Ende des Körpers beinhaltet. Ich möchte nur eine Sache klarstellen. Wenn du feststellst, dass man alle Plugins in einer Datei kombinieren muss, bedeutet das, dass der gesamte Plugins-Code in eine Datei anstatt in separate js-Dateien (plugin1.js, plugin2.js ..) eingefügt wird? Vielen Dank –

Sie sind richtig- Ich sprach über den Code von plugin1.js, plugin2.js etc und alles in eine einzige Javascript-Datei (ich nenne es plugins.js) setzen - so in meinem Beispiel oben, Ich hätte alle Plugins in der einzigen Datei plugin.js – iblamefish

Halten Sie meinen jQuery-Code von den HTML-Dateien entfernt

Antwort

Verwandte Themen