Apelarea unei funcții când pagina javascript este încărcată. Rularea mai multor funcții în onload

Dacă știi deja mai mult sau mai puțin JavaScript, atunci probabil ați auzit despre gestionarea evenimentelor sarcină, Care e numit onload. Acest eveniment se declanșează imediat când pagina este încărcată. Și de foarte multe ori o anumită funcție trebuie executată atunci când pagina este încărcată. Dar dacă ai nevoie rulați mai multe funcții javascript? De fapt, această întrebare a fost pusă de unul dintre utilizatorii site-ului. Prin urmare, aproximativ rulează mai multe funcții în onload, voi scrie în acest articol.

Soluția este cu adevărat trivială, rulați doar o funcție care rulează toate celelalte funcții necesare:





Dacă este deschis această pagină(nu există lucruri atât de importante precum etichetele html sau, de exemplu, titlul și codificarea paginii, pentru a simplifica înțelegerea codului), veți vedea cum vor funcționa funcțiile când pagina este încărcată b()și c().



faceți clic pe butonul de încărcare a paginii (4)

Vreau să rulez o funcție când pagina este încărcată, dar nu vreau să o folosesc .

Am un script care rulează dacă îl inițializez , De exemplu:

Cod funcțieAdresă() ( // cod )

Dar vreau să o conduc fără si am incercat multe lucruri precum:

Window.onload = codeAddress;

Dar nu merge.

Deci, cum îl rulez la încărcarea paginii?

window.onload = function() (...etc nu este un raspuns grozav.

Acest lucru va funcționa probabil, dar va întrerupe și orice alte funcții conectate deja la acest eveniment. Sau, dacă o altă funcție se agăță de acest eveniment după a ta, se va rupe. Deci, puteți petrece multe ore mai târziu încercând să vă dați seama de ce ceva care funcționează nu mai există.

Răspuns mai solid aici:

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

Un cod pe care l-am folosit a uitat unde l-am găsit pentru a acorda credit autorului.

Funcția my_function() ( // orice cod vreau să rulez după încărcarea paginii ) if (window.attachEvent) (window.attachEvent("onload", my_function);) else if (window.addEventListener) (window.addEventListener("load) ", my_function, false);) else (document.addEventListener ("încărcare", my_function, false);)

Sper că acest lucru vă ajută :)

În loc să folosească jQuery sau window.onload, JavaScript nativ a adoptat câteva caracteristici excelente de la lansarea jQuery. Toți au browsere moderne acum este propria functie DOM gata fără a utiliza biblioteca jQuery.

Document.addEventListener("DOMContentLoaded", function() ( alert("Gata!"); ), false);

window.onload = codAdresa; - ar trebui să funcționeze, iar codul complet este:

Test

Test

Aruncați o privire la scriptul domReady, care vă permite să configurați câteva funcții pentru a le executa atunci când DOM-ul este încărcat. Acest lucru este practic ceea ce Dom este gata să facă în multe biblioteci JavaScript populare, dar este ușor și poate fi luat și adăugat la începutul dvs. fișier extern scenariu.

Exemplu de utilizare

// adăugați referință la scriptul domReady sau plasați // conținutul scriptului înainte de aici funcția codeAddress() ( ) domReady(codeAddress);

Astăzi vreau să vorbesc despre o problemă care apare adesea pentru persoanele care încep să învețe Javascript.

Ei încearcă să interacționeze cu elemente HTML de pe pagină care au cod mai mic decât scriptul în sine. În consecință, scriptul s-a încărcat deja, dar elementul cu care va trebui să interacționați încă nu sa încărcat. Din acest motiv, nimic nu va funcționa.

Particularitate limbaj Javascript prin aceea că codul său este executat secvenţial, rând cu linie, aşa cum sunt scrise în codul sursă.

Iată un exemplu:

Document fără titlu

Regula css (culoare-fond:galben) nu va fi aplicată elementului cu id #block, deoarece linia

$("#block").css("culoare-fond", "galben");

Va fi executat înainte ca linia html să fie încărcată:

Ce se întâmplă dacă trebuie să executăm un cod sau o funcție numai după ce întregul document este încărcat complet?

Vreau să vorbesc despre trei moduri în care se poate face acest lucru.

1 cale. Folosind biblioteca jquery.

Cel mai adesea o folosesc eu, cea mai simplă și convenabilă soluție, dar necesită conectarea bibliotecii Jquery.

Iată cum va fi transformat codul anterior dacă folosim următoarea metodă.

Document fără titlu

2 sensuri. Cu elementul body și atributul onload.

Document fără titlu

3 căi. Cu obiectul window și proprietatea sa onload.

Document fără titlu

Alege metoda care se potrivește cel mai bine situației tale și pune-o în practică.