JavaScript-uitvoeringscode en -gids

Het ontwerpen van uw webpagina met JavaScript vereist aandacht voor de volgorde waarin uw code wordt weergegeven en of u nu code in functies of objecten inkapselt, die allemaal van invloed zijn op de volgorde waarin de code loopt.

Aangezien JavaScript op uw pagina wordt uitgevoerd op basis van bepaalde factoren, laten we eens kijken waar en hoe u JavaScript aan een webpagina kunt toevoegen.

Er zijn in feite drie locaties waar we JavaScript aan kunnen toevoegen:

• Rechtstreeks in de kop van de pagina
• Rechtstreeks in de hoofdtekst van de pagina
• Van een event handler / listener

Het maakt niet uit of JavaScript dat is binnen de webpagina zichzelf of in externe bestanden die aan de pagina zijn gekoppeld. Het maakt ook niet uit of de event handlers hard zijn gecodeerd op de pagina of door JavaScript zelf zijn toegevoegd (behalve dat ze niet kunnen worden geactiveerd voordat ze worden toegevoegd).

Wat betekent het om te zeggen dat JavaScript is

Code die zich binnen een functie of object bevindt, wordt alleen uitgevoerd wanneer die functie of dat object wordt aangeroepen.

Dit betekent in feite dat elke code in het hoofd en de hoofdtekst van uw pagina die niet in een functie of object zit, wordt uitgevoerd terwijl de pagina wordt geladen - zodra de pagina wordt geladen voldoende geladen om toegang te krijgen tot die code.

Dat laatste is belangrijk en heeft invloed op de volgorde waarin u uw code op de pagina plaatst: elke code die rechtstreeks op de pagina wordt geplaatst en die interactie moet hebben met elementen binnen de pagina, moet verschijnen na de elementen op de pagina waarvan het afhankelijk is.

Over het algemeen betekent dit dat als u directe code gebruikt om interactie te hebben met uw pagina-inhoud, deze code onderaan de body moet worden geplaatst.

Code binnen functies en objecten

Een code binnen functies of objecten wordt uitgevoerd wanneer die functie of dat object wordt aangeroepen. Als het wordt aangeroepen vanuit code die direct in het hoofd of de hoofdtekst van de pagina staat, dan is de plaats in de uitvoeringsvolgorde is in feite het punt waarop de functie of het object rechtstreeks wordt aangeroepen code.

Het toewijzen van een functie aan een gebeurtenishandler of luisteraar heeft niet tot gevolg dat de functie wordt uitgevoerd op het punt waarop deze is toegewezen - op voorwaarde dat u daadwerkelijk toewijzen de functie zelf en niet rennen de functie en het toewijzen van de geretourneerde waarde. (Dit is waarom je over het algemeen de () aan het einde van de functienaam wanneer deze wordt toegewezen aan een gebeurtenis sinds de toevoeging van de haakjes voert de functie uit en wijst de geretourneerde waarde toe in plaats van de functie toe te wijzen zelf.)

Functies die zijn gekoppeld aan gebeurtenishandlers en luisteraars worden uitgevoerd wanneer de gebeurtenis waaraan ze zijn gekoppeld, wordt geactiveerd. De meeste evenementen worden veroorzaakt door bezoekers die interactie hebben met uw pagina. Er zijn echter enkele uitzonderingen, zoals de laden gebeurtenis in het venster zelf, die wordt geactiveerd wanneer het laden van de pagina is voltooid.

Functies die zijn gekoppeld aan gebeurtenissen op pagina-elementen

Alle functies die zijn gekoppeld aan evenementen op elementen binnen de pagina zelf, worden uitgevoerd volgens de acties van elke individuele bezoeker - deze code wordt alleen uitgevoerd wanneer een bepaalde gebeurtenis plaatsvindt om deze te activeren. Om deze reden maakt het niet uit of de code nooit voor een bepaalde bezoeker wordt uitgevoerd, aangezien die bezoeker duidelijk niet de interactie heeft uitgevoerd die dit vereist.

Dit alles veronderstelt natuurlijk dat uw bezoeker uw pagina heeft geopend met een browser die dat wel heeft gedaan JavaScript ingeschakeld.

Sommige gebruikers hebben speciale scripts geïnstalleerd die mogelijk interageren met uw webpagina. Deze scripts worden uitgevoerd na al uw directe code, maar voordat elke code die is gekoppeld aan de load event handler.

Aangezien uw pagina niets weet over deze gebruikersscripts, kunt u niet weten wat deze externe scripts zouden kunnen doen - ze kunnen alle of alle code overschrijven die u aan de verschillende gebeurtenissen die u hebt toegewezen heeft toegevoegd verwerken. Als deze code voorrang heeft op gebeurtenishandlers of luisteraars, wordt bij het reageren op gebeurtenistriggers de door de gebruiker gedefinieerde code uitgevoerd in plaats van of naast uw code.

Het uitgangspunt hier is dat je er niet van uit kunt gaan dat code die is ontworpen om te worden uitgevoerd nadat de pagina is geladen, mag worden uitgevoerd zoals je hem hebt ontworpen. Houd er bovendien rekening mee dat sommige browsers opties hebben waarmee sommige gebeurtenishandlers binnen de browser, in welk geval een relevante gebeurtenistrigger de overeenkomstige gebeurtenishandler / listener in uw browser niet start code.