JavaScript discret este o abordare JavaScript a programarii web . Termenul a fost introdus în 2002 de către Stuart Langridge [1] . Principiile Javascript discret sunt de obicei înțelese după cum urmează:
Datorită implementărilor incompatibile ale limbajului și ale modelului de obiecte document în diferite browsere, JavaScript a avut o reputație de limbaj nepotrivit pentru aplicații și dezvoltare serioase. Apariția browserelor web bazate pe standarde , apariția interfețelor AJAX și Web 2.0 au schimbat situația, făcând JavaScript un instrument esențial. Dacă mai devreme JavaScript a fost folosit pentru sarcini relativ simple și neimportante, cum ar fi validarea de intrare în partea browserului și elemente decorative, atunci în viitor a început să fie folosit pentru a crea funcționalitatea principală a site-ului.
Performanța unui site web pentru cea mai largă audiență posibilă de utilizatori, inclusiv accesibilitatea pentru utilizatorii cu dizabilități , este obiectivul principal al unei abordări neintruzive. Atingerea scopului se bazează pe separarea prezentării și comportamentului, în care comportamentul este programat folosind scripturi JavaScript externe și legat de marcaj semantic [4] .
Prin aplicarea unei abordări non-intruzive, este mai ușor să se obțină următoarele rezultate [4] :
Cris Heilmann , unul dintre susținătorii abordării discrete, a scris șapte reguli pentru aceasta în 2007 [4] :
În mod tradițional, apelurile de funcții JavaScript erau plasate direct în marcajul documentului. Exemplul de mai jos ilustrează o implementare tipică a validării câmpurilor de formular:
<input type= "text" name= "date" onchange= "validateDate(this);" />Într-o abordare bine structurată a dezvoltării, marcajul este destinat să descrie structura unui document, nu comportamentul acestuia. Amestecarea structurii și comportamentului duce, printre altele, la o întreținere slabă a site-ului. Acest lucru se întâmplă din același motiv ca și atunci când amestecați structura și prezentarea: dacă site-ul conține sute de câmpuri de date, adăugarea atributului corespunzător onchangefiecăruia (și modificarea lor ulterior, dacă este necesar) poate fi o procedură consumatoare de timp.
Soluția discretă este să instalați programatic handlere de evenimente. Acest lucru se realizează de obicei prin separarea logică a elementelor care necesită unul sau altul handler într-o clasă cu procesare ulterioară:
<input type= "text" class= "validatedDate" />Scriptul poate analiza toate elementele de intrare legate de clasă validatedDateși poate seta handlerul dorit pentru ele:
fereastra . onload = function () { var intrari , i ; intrări = document . getElementsByTagName ( 'input' ); for ( i = 0 ; i < inputs . length ; i ++ ) { if ( inputs [ i ]. className == 'validatedDate' ) { inputs [ i ]. onchange = function () { validateDate (); }; } } }; funcția validateDate (){ // logica de gestionare }Următorul script este specific bibliotecii JavaScript jQuery :
$ ( document ). gata ( function (){ $ ( 'input.validatedDate' ). bind ( 'change' , validateDate ); }); funcția validateDate (){ // logica de gestionare }Deoarece atributul classreflectă rolul semantic al elementului, această abordare este în acord cu recomandările W3C bazate pe standardele actuale.