Ֆունկցիայի կանչում, երբ javascript էջը բեռնված է: Բազմաթիվ գործառույթների ներբեռնում

Եթե դուք արդեն քիչ թե շատ գիտեք JavaScript, ապա դուք հավանաբար լսել եք իրադարձությունների մշակողի մասին Բեռնելորը կոչվում է բեռնված... Այս իրադարձությունը գործարկվում է անմիջապես, երբ էջը բեռնվում է: Եվ շատ հաճախ, երբ էջը բեռնվում է, ինչ-որ գործառույթ պետք է կատարվի: Բայց ինչ, եթե անհրաժեշտ լինի գործարկել JavaScript-ի բազմաթիվ գործառույթներ? Փաստորեն, նման հարց է տվել կայքի օգտատերերից մեկը. Հետևաբար մոտ մի քանի գործառույթներ գործարկել ներբեռնման մեջ, ես կգրեմ այս հոդվածում։

Լուծումը իսկապես չնչին է, բավական է գործարկել մի գործառույթ, որում գործարկվում են բոլոր անհրաժեշտ մյուս գործառույթները.

Եթե բացես այս էջը(պիտակի նման կարևոր բաներ չկան htmlկամ, օրինակ, էջի վերնագիրը և կոդավորումը, որպեսզի ավելի հեշտ ըմբռնելի լինի ծածկագիրը), կտեսնեք, թե ինչպես են աշխատելու գործառույթները, երբ էջը բեռնվի: բ ()և գ ().

սեղմելով կոճակը էջը բեռնելիս (4)

Ես ուզում եմ գործարկել գործառույթը, երբ էջը բեռնված է, բայց ես չեմ ուզում այն օգտագործել .

Ես ունեմ սկրիպտ, որն աշխատում է, եթե ես այն սկզբնավորեմ , օրինակ:

Ֆունկցիայի կոդըՀասցե () (// կոդը)

Բայց ես ուզում եմ այն վարել առանց և ես փորձեցի շատ բաներ, ինչպիսիք են.

Window.onload = կոդՀասցե;

Բայց դա չի ստացվում:

Այսպիսով, ինչպե՞ս կարող եմ այն գործարկել էջի բեռնման ժամանակ:

window.onload = ֆունկցիա () (... և այլն) հիանալի պատասխան չէ:

Սա, հավանաբար, կաշխատի, բայց նաև կխախտի ցանկացած այլ գործառույթ, որն արդեն միանում է այս իրադարձությանը: Կամ, եթե ձեր իրադարձությունից հետո մեկ այլ գործառույթ հայտնվի այս իրադարձության վրա, այն կխախտվի: Այսպիսով, դուք կարող եք շատ ժամեր անց ծախսել՝ փորձելով պարզել, թե ինչու որևէ բան, որն աշխատում է, այլևս գոյություն չունի:

Ավելի վստահելի պատասխան այստեղ.

If (window.attachEvent) (window.attachEvent («onload», yourFunctionName);) else (if (window.onload) (var curronload = window.onload; var newonload = ֆունկցիա (evt) (curronload (evt); yourFunctionName ( evt);); window.onload = newonload;) else (window.onload = yourFunctionName;))

Որոշ կոդ, որ ես օգտագործել էի, մոռացել եմ, թե որտեղ եմ գտել այն հեղինակին վարկ տալու համար:

Ֆունկցիա my_function () (// ինչ կոդ ես ուզում եմ գործարկել էջի բեռնումից հետո) if (window.attachEvent) (window.attachEvent («onload», my_function);) ուրիշ եթե (window.addEventListener) (window.addEventListener («load ", my_function, false);) else (document.addEventListener ("load", my_function, false);)

Հուսով եմ, որ սա օգնում է :)

jQuery-ի կամ window.onload-ի օգտագործման փոխարեն, հայրենի JavaScript-ը գրավել է որոշ հիանալի հնարավորություններ jQuery-ի թողարկումից հետո: Բոլորն էլ ունեն ժամանակակից բրաուզերներայժմ ունի իր DOM-ի պատրաստ ֆունկցիան՝ առանց jQuery գրադարանի օգտագործման:

Document.addEventListener («DOMContentLoaded», ֆունկցիա () (զգուշացում («Պատրաստ է»);), False);

window.onload = կոդՀասցե; պետք է աշխատի, և ամբողջական կոդը հետևյալն է.

Փորձարկում

Նայեք domReady սկրիպտին, որը թույլ է տալիս կարգավորել բազմաթիվ գործառույթներ, որպեսզի կատարվեն, երբ DOM-ը բեռնված է: Սա հիմնականում այն է, ինչ Dom-ը պատրաստ է անել շատ հայտնի JavaScript գրադարաններում, բայց թեթև է և կարելի է վերցնել և ավելացնել ձեր սկզբում: արտաքին ֆայլսցենար.

Օգտագործման օրինակ

// ավելացնել հղում domReady script-ին կամ տեղը // script-ի բովանդակությունը այստեղից առաջ ֆունկցիայի codeAddress () () domReady (codeAddress);

Այսօր ես ուզում եմ խոսել մեկ խնդրի մասին, որը հաճախ առաջանում է այն մարդկանց մոտ, ովքեր սկսում են Javascript-ը սովորել:

Նրանք փորձում են շփվել էջի HTML տարրերի հետ, որոնք կոդով ավելի ցածր են, քան բուն սկրիպտը։ Համապատասխանաբար, սցենարն արդեն բեռնված է, բայց այն տարրը, որի հետ փոխազդելու համար, դեռ չկա: Այս պատճառով ոչինչ չի ստացվի։

Առանձնահատկություն Javascript լեզուքանի որ դրա կոդը կատարվում է հաջորդաբար, տող առ տող, ինչպես դրանք գրված են սկզբնաղբյուրում:

Ահա մի օրինակ.

Անվերնագիր փաստաթուղթ

css կանոնը (ֆոնի գույնը՝ դեղին) չի կիրառվի id #block ունեցող տարրի վրա, քանի որ տող

$ («# բլոկ») css («ֆոնային գույն», «դեղին»);

Կկատարվի մինչև html տողի բեռնումը.

Ի՞նչ անել, եթե մենք պետք է գործարկենք կոդը կամ գործառույթը միայն ամբողջ փաստաթղթի ամբողջական բեռնումից հետո:

Ես ուզում եմ խոսել երեք եղանակների մասին, թե ինչպես կարող եք դա անել:

1 ճանապարհ. Օգտագործելով Jquery գրադարանը:

Ամենից հաճախ ես ինքս օգտագործում եմ այն, ամենապարզ և ամենահարմար լուծումը, բայց դա պահանջում է Jquery գրադարանի միացում:

Ահա թե ինչպես փոխակերպել նախորդ կոդը, եթե օգտագործենք հետևյալ մեթոդը.

Անվերնագիր փաստաթուղթ