2012-05-24 7 views
5

I Wiem, że to brzmi jak głupie pytanie, ale ponieważ uczę się jQuery przez przykład, stwierdzam, że rozmieszczenie skryptów i funkcji różni się bardzo w zależności od przykładu . Na przykład, gdzieś czytałem, że funkcja .onReady powinna być umieszczona poniżej wszystkiego, aby upewnić się, że cały DOM jest rzeczywiście gotowy, i rzeczy o tym charakterze.Sugestia umieszczania kodu jQuery

Pytanie brzmi po prostu, że oprócz zbędnych tagów skryptów, istnieje najlepsza praktyka w miejscu, w którym powinien znajdować się jquery pliku PHP? A co z jednorazowymi skryptami wbudowanymi? Przepraszam za naiwny charakter tego, ale chciałbym próbować tych przykładów w "właściwy" sposób, ponieważ zastanawiam się, jak je połączyć.

Ta strona wydaje się mieć bardzo wnikliwych ludzi, którzy wnoszą swój wkład, więc z góry dziękuję za wskazówki! :)

Najwyraźniej to nie było tak głupie, jak myślałem - dziękuję wszystkim za wgląd - czuję się trochę bardziej wyraziście w tym, co starałem się zrozumieć na wielkim obrazie.

+2

Jest to szczególnie interesujące pytanie, ponieważ ramy takie jak ASP.Net MVC, które budują strony jako szereg komponentów (aka wyświetleń) mają tendencję do utrzymania fragmentów HTML i skrypty, które działają na tych fragmentów w tym samym widoku, powodując wynikowy JavaScript do rozproszenia na temat końcowej strony. Zastanawiałem się wcześniej, czy są problemy z tym podejściem. –

+0

Jestem z tobą ... pracowałem z dziesiątkami różnych języków/struktur w mojej karierze i nie znając go, jak działa każdy z nich, zastanawiałem się nad tym, kiedy wracam nocą do domu, lol. – GDP

+0

+1 dla miękkiego języka – Rab

Odpowiedz

8

AFAIK nie ma .onReady

Może masz na myśli $(document).ready()?

Punkt .ready() polega na odczekaniu, aż element będzie gotowy. W tym przypadku dokument. Więc nic z tego nie zostanie wykonane, dopóki dokument nie będzie gotowy. W związku z tym możesz umieścić go w dowolnym miejscu.

Jak dla którego odwołuje się do plików JS, jednak chcesz to zrobić na dole dokumentu ze względu na wydajność:

http://developer.yahoo.com/performance/rules.html

+1

Być może jest to oczywiste, ale na wszelki wypadek trzeba umieścić '$ (document) .ready() po wczytaniu jQuery, więc 'wszędzie 'nie jest ściśle prawdą. – jeroen

+0

DA, zaakceptuje twoją odpowiedź, ponieważ odpowiada ona na mój najszerszy problem, a nie tylko zajmuje się aspektem .ready. Dziękuję bardzo za wgląd i link. –

+1

Tylko jeden punkt klarowności, '.ready()' może być wywołany tylko na 'dokumencie', nie zadziała dla zwykłych elementów i zostanie wywołany tylko raz. –

2

Powinieneś dołączyć swoją <script type="text/javascript"></script> przed zamknięciem tagu <body> swojej strony. To zapewni, że cała statyczna część strony powyżej zostanie załadowana przed nią.

+0

Zobacz mój komentarz pod pytaniem o to, jak niektóre frameworki komponują strony ze składników. Dlaczego mówisz "powinien". Co może/może się zepsuć, jeśli tego nie zrobisz? –

+0

Powinieneś umieścić go tam ze względu na wydajność - ale z jQuery nie ma potrzeby umieszczania go tam z powodu oczekiwania na statyczne części domeny do załadowania. (Innymi słowy, tak, umieścić go przed zamykającym znacznikiem BODY, ale z innych powodów) –

+0

A także, tam są wybory do przeszukiwania kodu związanego niektórych zdarzeń wyzwalanych przez przeglądarkę jak .load, .ready itp – Vishal

4

nie wiem o PHP, ale dyspozycja umieść każdy kod OnReady na dole "aby upewnić się, że cały DOM jest rzeczywiście gotowy"jest nieprawidłowy!

Cały sens przygotowanego wydarzenia polega na tym, że można go umieścić w dowolnym miejscu i nadal będzie działać.

Przykład:

$('#foo').val() // undefined - the DOM isn't ready yet. 

$(document).ready(function(){ 
    $('#foo').val() // bla - the DOM is ready now. 
}); 
<input id="foo" value="bla" /> 

Live DEMO

Zauważ, że $(callbackFunction) równa składni gadatliwym $(document).ready(callbackFunction);

Należy przeczytać gotowy ready docs

+0

Nie powiedziałbym, że sama instrukcja jest błędna. Rozumowanie jest na pewno złe. – kapa

+0

@ bažmegakapa. Punkt wzięty. Edytowałem to trochę. – gdoron

0

Instrukcja pozwala umieścić swoje kod javascript everyw tutaj. Będzie on wykonany tylko wtedy, gdy dokument będzie gotowy.

Składnia jest następująca:

$(document).ready(function() { 
    // Put your code here. 
}); 

LUB tego:

$(function() { 
// Put your code here. 
}); 

jednak dokonać wyboru, wolą dole strony, tuż przed zamknięciem </body>, ze względu na wydajność.

Powiązane problemy