JavaScript utsetter attributt

JavaScript utsetter attributt
Hvis du noen gang har søkt etter nettutvikling eller design av nettsteder, er sjansen stor for at du sannsynligvis har hørt om HTML. Vel, HTML står for “Hyper-text-markup-språk ”. HTML brukes i kombinasjon med CSS for å utvikle attraktive og responsive websider. JavaScript er et programmeringsspråk som gjør det mulig for våre websider og webapplikasjoner å tenke og handle og gjøre webapplikasjonene våre interaktive. Hele HTML -dokumentet skannes først av nettleseren for CSS, JavaScript eller noe annet referert materiale som et bilde, og denne prosessen kalles HTML -parsing. Nettleseren ber deretter om hver av ressursfilene fra serveren hvis ressurser blir funnet i HTML. Når nettleseren har alle nødvendige ressurser, begynner den å konstruere siden.

JavaScript kan refereres til av manus Tag of HTML og JavaScript kalles en analyser blokkerer ressurs Fordi HTML -parsing er blokkert av JavaScript. For å løse dette problemet manus Tag of HTML tilbyr oss async og utsette attributter dermed lar oss ha mer kontroll over hvordan og når eksterne filer blir hentet og utført. I dette innlegget vil vi utforske hva JavaScript Defer -attributt er og hvordan vi kan bruke utsettingsattributtet.

Normal utførelse

La oss se på virkningen av hva som skjer når utsettingsattributtet ikke er der. JavaScript -filer vil som standard pause analysen av HTML -teksten slik at de kan hentes (hvis ikke inline) og kjøres.

La oss si at vi har et skriptetag et sted midt på en HTML -side, og det er HTML -kode over og under manus stikkord:







Dokument






HTML -parseren vil skanne denne siden, og når den når skriptetoden, vil den pause HTML -analysering og hente JavaScript kode.JS fil i skriptetoden og utfør deretter filen. Når utførelsen og hente av JavaScript -filen er fullført, fortsetter først HTML -parsingen igjen. Denne prosessen forsinker gjengivelsen av HTML og bremser dermed websiden vår ved å ta litt tid å laste inn websiden fullt ut.

Hva er utsettingsattributtet?

Utsettelsesegenskapen kan bare ha en ekte verdi eller en falsk verdi, vi kan konkludere med at det er en boolsk attributt. Det er en attributt som bare brukes til eksterne skript. Hvis denne egenskapen brukes, definerer den at nettleseren ikke skal vente på at skriptet skal laste. Betydning, i noen tilfeller kan eksterne skript ta mye tid å laste, denne egenskapen sier ganske enkelt å laste dokumentet før du laster inn skriptet. Med enkle ord venter ikke utsettingsattributtet på manus Tag og behandlingen av HTML fortsetter, og gjør derfor vår webside til å øke belastningsytelsen. Syntaks for utsettingsattributt er:

Det bør merkes at utsettingsattributtet bare kan brukes på eksterne ark/skript når src Attributt er til stede i skriptetoden. Det skal også bemerkes at utsettingsattributt ikke kan brukes på inline kode.

Defer -attributtet ligner på den asynkrone prosessen, det vil si at du kan flytte til en annen oppgave selv når den første oppgaven ikke er fullført.

Eksempel

Vi bruker et eksternt JavaScript -ark med navnet på kode.JS:







Dokument


Før manus



Etter skript: vil utføre umiddelbart



Vi innledet a p tag og deretter et skriptet merke som refererer til kode.JS fil og deretter igjen a p stikkord.

I kode.JS fil, vi bare trøste.Logg Hei Verden!:

konsoll.Logg ("Hello World!");

Vi vil se følgende utgang:

Nettleserstøttbarhet

Tallene gitt i tabellen indikerer hvilken nettleserversjon som var den første som implementerte attributtet fullstendig.

Egenskap Mozilla Firefox Microsoft Edge Google Chrome Opera Safari
utsette 3.5 10.0 8.0 15.0 5.0

Konklusjon

Normal utførelse av HTML er blokkert når det er en skriptet merke. Skriptkode henter en ekstern fil eller lenke og utfører den dermed blokkerer den normale analysingen av HTML. DEFER -attributtet er løsningen som utsatt attributt vil hjelpe oss å laste ned skriptene våre så snart som mulig uten å blokkere nettleseren/HTML, da den forteller at nettleseren ikke skulle vente på manus stikkord. I dette innlegget ble utsatt attributt i JavaScript diskutert sammen med et eksempel og nettleserens støttebarhet.