Diskret JavaScript er en JavaScript - tilgang til webprogrammering . Udtrykket blev introduceret i 2002 af Stuart Langridge [1] . Principperne for diskret Javascript forstås normalt som følgende:
På grund af inkompatible implementeringer af sproget og Document Object Model i forskellige browsere, har JavaScript haft ry som et sprog, der er uegnet til seriøs applikation og udvikling. Fremkomsten af standardbaserede webbrowsere , fremkomsten af AJAX -grænseflader og Web 2.0 ændrede situationen, hvilket gjorde JavaScript til et vigtigt værktøj. Hvis tidligere JavaScript blev brugt til relativt enkle og uvigtige opgaver, såsom browser-side inputvalidering og dekorative elementer, så begyndte det i fremtiden at blive brugt til at skabe hovedfunktionaliteten på webstedet.
Et websteds ydeevne for det bredest mulige publikum af brugere, herunder tilgængelighed for brugere med handicap , er hovedmålet med en ikke-påtrængende tilgang. Opnåelse af målet er baseret på adskillelse af præsentation og adfærd, hvor adfærden programmeres ved hjælp af eksterne JavaScript-scripts og knyttes til semantisk markup [4] .
Ved at anvende en ikke-påtrængende tilgang er det lettere at opnå følgende resultater [4] :
Cris Heilmann , en af fortalerne for den diskrete tilgang, skrev syv regler for det i 2007 [4] :
Traditionelt blev JavaScript-funktionskald placeret direkte i dokumentets opmærkning . Eksemplet nedenfor illustrerer en typisk implementering af formularfeltvalidering:
<input type= "text" name= "date" onchange= "validateDate(this);" />I en velstruktureret tilgang til udvikling er markup beregnet til at beskrive strukturen af et dokument, ikke dets adfærd. Blanding af struktur og adfærd fører blandt andet til dårlig vedligeholdelse af webstedet. Dette sker af samme grund, som når man blander struktur og præsentation: Hvis webstedet indeholder hundredvis af datafelter, onchangekan det være en tidskrævende procedure at tilføje den passende attribut til hver (og ændre dem senere, hvis det er nødvendigt).
Den diskrete løsning er at programmere installere hændelseshandlere. Dette opnås normalt ved logisk at adskille elementer, der kræver en eller anden behandler, i en klasse med efterfølgende behandling:
<input type= "text" class= "validatedDate" />Scriptet kan se på alle input-elementer relateret til klassen validatedDateog indstille den ønskede handler for dem:
vindue . onload = funktion () { var inputs , i ; inputs = dokument . getElementsByTagName ( 'input' ); for ( i = 0 ; i < inputs . length ; i ++ ) { if ( inputs [ i ]. className == 'validatedDate' ) { inputs [ i ]. onchange = function () { validateDate (); }; } } }; function validateDate (){ // handler logic }Følgende script er specifikt for jQuery JavaScript-biblioteket :
$ ( dokument ). klar ( funktion (){ $ ( 'input.validatedDate' ). bind ( 'change' , validateDate ); }); function validateDate (){ // handler logic }Da attributten classafspejler elementets semantiske rolle, er denne tilgang i god overensstemmelse med W3C 's anbefalinger baseret på nuværende standarder.