Kørsel kode, når siden er klar
Hvis du prøver at udføre JavaScript-kode, der manipulerer nogle elementer i den webside uden at sikre, at uanset om elementerne helt indlæst, vil resultere i uventede resultater. For eksempel er der en P element, hvis ID er "highlight" under indlæsning den side, du ønsker at anvende en baggrundsfarve på elementet. I en typisk løsning ved hjælp generiske JavaScript du vil gå til noget i retning af følgende:
var highlightDiv = document.getElementById ("highlight") if (typeof highlightDiv === "objekt") {highlightDiv.style.baggrundsfarve = "gule"; highlightDiv.style.color = "blå"; highlightDiv.style.border = "1px solid red";}
I ovenstående kode, vi har anvendt en baggrundsfarve, en 1px grænsen i rød farve og gjort skriftfarve blå. Bemærk, at vi ikke behøver at gøre det på denne måde i stedet kan vi skabe en klasse med en baggrundsfarve gul, 1px grænsen i rød og farve i blåt og blot anvende klassen. Men jeg ønsker blot at demonstrere det punkt, at jeg taler om.
Antag, at du udfører ovenstående stykke kode, før element belastninger i browseren.
Som du har tænkt denne kode vil ikke som forventet og springe krævede udførelse. Den fælles tilgang er du placerer kode efter div element, som det kommer til at udføre operationen. Salg
En anden mest almindelige IE udstedelsen til IE8 blev "Operation afbrudt" fejl. I denne fejl et barn element forsøger at opdatere sit moderselskab, før den forælder element indlæser sig selv helt i DOM. For eksempel scriptet forsøger at indsætte et nyt element ind til kroppen element før kroppens belastninger i DOM helt.
Dette er det sted, hvor onload begivenhed af vinduet objektet kommer handy.
Lad os undersøge et stykke kodeeksempel:
window.onload = function () {var d = document.createElement ("div"); d = "Test data"; document.body.appendChild (d);}Ovenstående kode er perfekt og vil blive henrettet efter DOM Loading fuldender. Alt er fint?
Nej der er stadig nogle problemer i denne tilgang