JavaScriptissä tätä tapahtumaa voidaan käyttää tietyn toiminnon käynnistämiseen, kun sivu on kokonaan näytössä. Sitä voidaan käyttää myös vierailijan selaimen tyypin ja version tarkistamiseen. Voimme tarkistaa mitä evästeitä sivu käyttää käyttämällä lastina attribuutti.
HTML:ssä onload-attribuutti käynnistyy, kun objekti on ladattu. Tämän määritteen tarkoitus on suorittaa komentosarja, kun siihen liittyvä elementti latautuu.
HTML:ssä lastina attribuuttia käytetään yleensä kanssa elementti komentosarjan suorittamiseksi, kun verkkosivun sisältö (mukaan lukien CSS-tiedostot, kuvat, skriptit jne.) on ladattu kokonaan. Sitä ei tarvitse käyttää vain tagin kanssa, koska sitä voidaan käyttää muiden HTML-elementtien kanssa.
Ero document.onload ja window.onload On: document.onload laukaisee ennen kuvien ja muun ulkoisen sisällön lataamista. Se ammutaan ennen window.onload . Samalla kun window.onload laukeaa, kun koko sivu latautuu, mukaan lukien CSS-tiedostot, komentosarjatiedostot, kuvat jne.
uusi rivi python
Syntaksi
window.onload = fun()
Ymmärretään tämä tapahtuma käyttämällä joitain esimerkkejä.
Esimerkki1
Tässä esimerkissä on div-elementti, jonka korkeus on 200 kuvapistettä ja leveys 200 kuvapistettä. Tässä käytämme window.onload() muuttaaksesi taustan väriä, leveyttä ja korkeutta div elementti verkkosivun lataamisen jälkeen.
Taustaväri on asetettu 'punainen' , ja leveys ja korkeus on asetettu arvoon 300 pikseliä jokainen.
window.onload() #bg{ width: 200px; height: 200px; border: 4px solid blue; } window.onload = function(){ document.getElementById('bg').style.backgroundColor = 'red'; document.getElementById('bg').style.width = '300px'; document.getElementById('bg').style.height = '300px'; } <h2> This is an example of window.onload() </h2>Testaa nyt
Lähtö
css kommentti
Koodin suorittamisen ja sivun lataamisen jälkeen tulos on -
Esimerkki2
Tässä esimerkissä toteutamme yksinkertaisen animaation käyttämällä DOM-objektin ominaisuuksia ja toimintoja javascript . Käytämme JavaScript-toiminto getElementById() DOM-objektin hankkimiseksi ja sitten objektin määrittämiseksi globaaliksi muuttujaksi.
q1 q2 q3 q4
var img = null; function init(){ img = document.getElementById('myimg'); img.style.position = 'relative'; img.style.left = '50px'; } function moveRight(){ img.style.left = parseInt( img.style.left) + 100 + 'px'; } window.onload = init; <p>Click the below button to move the image right</p>Testaa nyt
Lähtö
Kun yllä oleva koodi on suoritettu onnistuneesti, tulos on -
Nyt on esimerkki, jossa käytämme HTML-koodia lastina attribuutti ja JavaScript-funktiot.
java-lajitteluluettelo
Esimerkki3
Se on yksinkertainen esimerkki HTML:n käytöstä lastina attribuutti JavaScriptissä määritellyllä funktiolla. Tässä esimerkissä hälytys() toimintoa kutsutaan aina, kun asiakirja päivittyy.
function fun() { alert('Hello World!!, Welcome to the javaTpoint.com'); } <p> Try to refresh the document to see the effect. </p>Testaa nyt
Lähtö
Yllä olevan koodin suorittamisen jälkeen tulos on -