Pozivanje funkcije kada se učita javascript stranica. Pokretanje više funkcija u onload

Ako već manje-više znate JavaScript onda ste vjerovatno čuli za obrađivač događaja Učitaj koji se zove onload... Ovaj događaj se pokreće odmah kada se stranica učita. I vrlo često, kada se stranica učita, mora se izvršiti neka funkcija. Ali šta ako treba pokrenite više JavaScript funkcija? Zapravo, ovo pitanje je postavio jedan od korisnika na stranici. Stoga o pokretanje više funkcija u onload, pisaću u ovom članku.

Rješenje je zaista trivijalno, dovoljno je pokrenuti funkciju u kojoj se pokreću sve potrebne druge funkcije:





Ako otvorite ovu stranicu(nema važnih stvari kao što je oznaka html ili, na primjer, naslov i kodiranje stranice, kako bi se olakšalo razumijevanje koda), vidjet ćete kako će se funkcije pokrenuti kada se stranica učita b () i c ().



klik na dugme prilikom učitavanja stranice (4)

Želim pokrenuti funkciju kada se stranica učita, ali ne želim je koristiti .

Imam skriptu koja se pokreće ako je inicijaliziram , Na primjer:

Funkcijski kodAdresa () (// kod)

Ali želim da ga pokrenem bez i probao sam mnoge stvari poput:

Window.onload = codeAddress;

Ali to ne radi.

Pa kako da ga pokrenem pri učitavanju stranice?

window.onload = function () (... itd. nije sjajan odgovor.

Ovo će vjerovatno funkcionirati, ali će također prekinuti bilo koju drugu funkcionalnost koja se već povezuje s ovim događajem. Ili, ako druga funkcija uhvati ovaj događaj nakon vašeg, pokvarit će se. Dakle, možete provesti mnogo sati kasnije pokušavajući shvatiti zašto nešto što funkcionira više ne postoji.

Pouzdaniji odgovor ovdje:

If (window.attachEvent) (window.attachEvent ("onload", yourFunctionName);) else (if (window.onload) (var curronload = window.onload; var newonload = funkcija (evt) (curronload (evt); yourFunctionName ( evt);); window.onload = newonload;) else (window.onload = yourFunctionName;))

Neki kod koji sam koristio zaboravio sam gdje sam ga našao da bih dao priznanje autoru.

Funkcija my_function () (// koji god kod želim da pokrenem nakon učitavanja stranice) if (window.attachEvent) (window.attachEvent ("onload", my_function);) else if (window.addEventListener) (window.addEventListener ("load ", my_function, false);) else (document.addEventListener (" load ", my_function, false);)

Nadam se da ovo pomaže :)

Umjesto korištenja jQueryja ili window.onloada, izvorni JavaScript je preuzeo neke sjajne karakteristike od objavljivanja jQueryja. Svi imaju moderni pretraživači sada ima vlastitu funkciju spremnu za DOM bez korištenja jQuery biblioteke.

Document.addEventListener ("DOMContentLoaded", funkcija () (upozorenje ("Spremno!");), False);

window.onload = codeAddress; trebao bi raditi - a kompletan kod je:

Test

Test

Pogledajte domReady skriptu, koja vam omogućava da konfigurišete više funkcija za izvršavanje kada se DOM uči. Ovo je u osnovi ono što je Dom spreman učiniti u mnogim popularnim JavaScript bibliotekama, ali je lagan i može se uzeti i dodati na početku vašeg eksterni fajl script.

Primjer upotrebe

// dodati referencu na domReady skriptu ili smjestiti // sadržaj skripte prije ovdje function codeAddress () () domReady (codeAddress);

Danas želim da pričam o jednom problemu koji se često javlja ljudima koji počinju da uče Javascript.

Oni pokušavaju da stupe u interakciju sa HTML elementima na stranici koji imaju niži kod od same skripte. Shodno tome, skripta je već učitana, ali element za interakciju još nije tu. Iz tog razloga ništa neće raditi.

Posebnost Javascript jezik u tome što se njegov kod izvršava sekvencijalno, red po red, onako kako su napisani u izvornom kodu.

Evo primjera:

Dokument bez naslova

css pravilo (boja pozadine: žuta) neće biti primijenjeno na element sa id #block, jer linija

$("# blok").css ("boja pozadine", "žuta");

Izvršiće se prije učitavanja html linije:

Što ako trebamo izvršiti kod ili funkciju tek nakon što se cijeli dokument u potpunosti učita?

Želim razgovarati o tri načina kako to možete učiniti.

1 način. Korištenje Jquery biblioteke.

Najčešće ga sam koristim, najjednostavnije i najzgodnije rješenje, ali zahtijeva povezivanje Jquery biblioteke.

Evo kako da transformišemo prethodni kod ako koristimo sledeću metodu.

Dokument bez naslova

Metoda 2. Sa elementom tijela i atributom onload.

Dokument bez naslova

Metoda 3. Korištenje objekta prozora i njegovog svojstva onload.

Dokument bez naslova

Odaberite metodu koja najbolje odgovara vašoj situaciji i primijenite je u praksi.