*   >> Lezen Onderwijs artikelen >> tech >> web development

jQuery Lesson Series - 2

Running Code wanneer de pagina klaar is

Als u probeert om de JavaScript-code dat sommige elementen in de webpagina manipuleert zonder ervoor te zorgen dat de vraag of de elementen worden geladen volledig zal resulteren in te voeren onverwachte resultaten. Zo is er een P element waarvan ID is "hoogtepunt" tijdens het laden van de pagina die u wilt een achtergrondkleur op het element toe te passen. In een typische oplossing met generieke JavaScript zou je gaan voor iets als het volgende:

 var highlightDiv = document.

getElementById ("highlight"); if (typeof highlightDiv === "object") {highlightDiv.style. backgroundColor = "gele"; highlightDiv.style.color = "blue"; highlightDiv.style.border = "1px solid rode";}

In de bovenstaande code hebben we een achtergrondkleur, een 1px grens toegepast in rode kleur en maakte het lettertype kleur blauw. Houd er rekening mee dat we niet moeten doen als dit in plaats daarvan kunnen we een klas met een achtergrond kleur geel, 1px grens in rood en kleur in blauw te maken en eenvoudig toe te passen de klas. Maar ik wil gewoon het punt dat ik het over heb laten zien.

Stel dat u het uitvoeren van het bovenstaande stukje code voor het element geladen in de browser. Als je hebt nagedacht, deze code zal niet werken zoals verwacht en sla de gewenste uitvoering. De gemeenschappelijke aanpak is dat je de code na de div element waar het gaat om de operatie uit te voeren plaatsen.

Een andere meest voorkomende IE afgifte tot IE8 was de "Operation Aborted" fouten. In deze fout probeert een kind element aan haar moedermaatschappij te werken voordat het bovenliggende element laadt zich volledig in de DOM.

Bijvoorbeeld het script probeert een nieuw element in te voegen in het lichaam element voordat het lichaam lasten in de DOM helemaal.

Dit is de plaats waar de gebeurtenis onload van het venster object komt handig. Laten we onderzoeken een stuk voorbeeldcode:

 window.onload = function () {var d = document.createElement ("div"); d = "Test Data"; document.body.appendChild (d);} 

De bovenstaande code is perfect en zal worden uitgevoerd na de DOM laden voltooid.

Alles in orde is?

Nee er zijn nog steeds enkele problemen in deze benadering

  • In het bovenstaande manier alleen dit stukje code wordt uitgevoerd als het event handler van de gebeurtenis onload van het venster object . Als er een ander venster onload event handler dat laatste voorrang op alle andere.

  • Dit evenement han

    Page   <<       [1] [2] >>
  • Copyright © 2008 - 2016 Lezen Onderwijs artikelen,https://onderwijs.nmjjxx.com All rights reserved.