The valmis() jQueryn toiminto suorittaa koodin vain, kun DOM (Document Object Model) on ladattu täyteen. Se on jQueryn sisäänrakennettu toiminto. Se voi käynnistyä ennen kaikkien kuvien lataamista jne., mutta vain kun DOM on valmis. Väliin lisätty koodi $(asiakirja).ready() suoritetaan vain, kun sivu on valmis JavaScript-koodin suorittamista varten.
Meidän ei pitäisi käyttää valmis() menetelmä yhdessä .
Syntaksi
Voimme käyttää valmis() toimivat kahdella tavalla alla kuvatulla tavalla.
- Yleisesti käytetty syntaksi valmis () toiminto on seuraava.
$(document).ready(function)
- Kuten voimme käyttää valmis() toiminto vain nykyiselle asiakirjalle, joten valitsin voidaan ohittaa. Voimme myös kirjoittaa yllä olevan syntaksin seuraavasti.
$(function)
Molemmat yllä olevat tavat kelpaavat käytettäväksi. Toista syntaksia voidaan käyttää vaihtoehtona ensimmäiselle syntaksille. Se voi olla selvää seuraavasta koodinpätkästä.
base64-dekoodaus js:ssä
$(document).ready(function() { $('p').css('color', 'red'); }); Yllä oleva koodi vastaa alla olevaa koodia.
$(function() { $('p').css('color', 'red'); }); Jotkut kokeneet kehittäjät käyttävät lyhennettä $() käyttämisen sijaan $(asiakirja).ready(), mutta jos kirjoitamme koodia kokemattomille ihmisille, niin on parempi käyttää pitkää muotoa.
Parametrien arvot
The valmis() funktiolla on vain yksi parametriarvo, joka määritellään seuraavasti.
funktio(): Se on pakollinen parametri, joka määrittää toiminnon, joka suoritetaan asiakirjan lataamisen jälkeen.
Katsotaanpa esimerkkiä $(asiakirja).ready() toiminto.
Esimerkki
Tässä esimerkissä on joitain kappaleelementtejä ja painike. Tässä meillä on käytössä $(asiakirja).ready() toiminto muuttaa annettujen kappaleiden tyyliä.
jQuery ready() function $(document).ready(function(){ $('button').click(function(){ $('#p1').css({'font-size': '30px', 'color': 'blue', 'background': 'yellow', 'fontWeight': 'bold'}); $('#p2').css({'fontSize': '20px', 'fontWeight': 'bold', 'color': 'red'}); $('#p3').css({'color': 'blue'}); }); }); <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 Testaa nyt Lähtö:
Yllä olevan koodin suorittamisen jälkeen tulos on -
Kun napsautat annettua painiketta, tulos on -
