logo

Funkcja jQuery Ready().

The gotowy() funkcja w jQuery wykonuje kod tylko wtedy, gdy DOM (model obiektowy dokumentu) jest w pełni załadowany. Jest to wbudowana funkcja w jQuery. Może zostać uruchomiony przed załadowaniem wszystkich obrazów itp., ale tylko wtedy, gdy DOM jest gotowy. Kod wstawiony pomiędzy $(dokument).gotowy() jest wykonywany tylko wtedy, gdy strona jest gotowa do wykonania kodu JavaScript.

Nie powinniśmy używać tzw gotowy() metoda wraz z .

Składnia

Możemy skorzystać z gotowy() działać na dwa sposoby, jak podano poniżej.

  • Powszechnie stosowana składnia gotowy() funkcja jest następująca.
 $(document).ready(function) 
  • Ponieważ możemy skorzystać z gotowy() funkcję tylko dla bieżącego dokumentu, więc selektor można pominąć. Powyższą składnię możemy również zapisać w następujący sposób.
 $(function) 

Oba powyższe sposoby są ważne w użyciu. Drugiej składni można używać jako alternatywy dla pierwszej składni. Można to jasno wywnioskować z poniższego fragmentu kodu.

 $(document).ready(function() { $('p').css('color', 'red'); }); 

Powyższy kod jest odpowiednikiem poniższego kodu.

 $(function() { $('p').css('color', 'red'); }); 

Niektórzy doświadczeni programiści używają skrótu $() zamiast używać $(dokument).gotowy(), ale jeśli piszemy kod dla osób niedoświadczonych, to lepiej zastosować długą formę.

Wartości parametrów

The gotowy() funkcja ma tylko jedną wartość parametru zdefiniowaną w następujący sposób.

funkcjonować(): Jest to obowiązkowy parametr określający funkcję, która zostanie wykonana po załadowaniu dokumentu.

Zobaczmy przykład użycia $(dokument).gotowy() funkcjonować.

Przykład

W tym przykładzie jest kilka elementów akapitu i przycisk. Tutaj używamy $(dokument).gotowy() funkcja zmiany stylu podanych akapitów.

 jQuery ready() function $(document).ready(function(){ $(&apos;button&apos;).click(function(){ $(&apos;#p1&apos;).css({&apos;font-size&apos;: &apos;30px&apos;, &apos;color&apos;: &apos;blue&apos;, &apos;background&apos;: &apos;yellow&apos;, &apos;fontWeight&apos;: &apos;bold&apos;}); $(&apos;#p2&apos;).css({&apos;fontSize&apos;: &apos;20px&apos;, &apos;fontWeight&apos;: &apos;bold&apos;, &apos;color&apos;: &apos;red&apos;}); $(&apos;#p3&apos;).css({&apos;color&apos;: &apos;blue&apos;}); }); }); <p id="p1"> Welcome to the javaTpoint.com </p> <p id="p2"> This is an example of using the $(document).ready() function. </p> <p id="p3"> This is a third paragraph element </p> <p> Click the following button to see the effect. </p> Click me 
Przetestuj teraz

Wyjście:

Po wykonaniu powyższego kodu wyjściem będzie -

Funkcja jQuery Ready().

Po kliknięciu danego przycisku wyjściem będzie -

Funkcja jQuery Ready().