Az Unobtrusive JavaScript a webes programozás JavaScript megközelítése . A kifejezést 2002-ben Stuart Langridge vezette be [1] . Az észrevétlen Javascript alapelvei általában a következők:
A nyelv és a Dokumentumobjektum -modell különböző böngészőkben való inkompatibilis implementációi miatt a JavaScript komoly alkalmazásra és fejlesztésre alkalmatlan nyelv hírében állt. A szabvány alapú webböngészők , az AJAX interfészek és a Web 2.0 megjelenése megváltoztatta a helyzetet, és a JavaScript alapvető eszközzé vált. Ha korábban a JavaScript-et viszonylag egyszerű és lényegtelen feladatokra használták, mint például a böngészőoldali bevitel érvényesítése és a díszítőelemek, akkor a jövőben az oldal fő funkcióinak létrehozására kezdték használni.
A nem tolakodó megközelítés fő célja, hogy egy webhely a felhasználók lehető legszélesebb közönsége számára nyújtson teljesítményt, ideértve a fogyatékkal élő felhasználók számára való akadálymentesítést is. A cél elérése a megjelenítés és a viselkedés szétválasztásán alapul, amelyben a viselkedés külső JavaScript-szkriptek segítségével programozható, és szemantikai jelöléshez kötődik [4] .
A non-intruzív megközelítés alkalmazásával könnyebben elérhetjük a következő eredményeket [4] :
Cris Heilmann , a nem tolakodó megközelítés egyik híve hét szabályt írt rá 2007-ben [4] :
Hagyományosan a JavaScript függvényhívásokat közvetlenül a dokumentum jelölésében helyezték el . Az alábbi példa az űrlapmező-érvényesítés tipikus megvalósítását szemlélteti:
<input type= "text" name= "dátum" onchange= "validateDate(this);" />A fejlesztés jól strukturált megközelítésében a jelölés a dokumentum szerkezetét írja le, nem pedig viselkedését. A szerkezet és a viselkedés keveredése többek között a webhely rossz karbantarthatóságához vezet. Ez ugyanazon okból történik, mint a szerkezet és a megjelenítés keverésekor: ha az oldal több száz adatmezőt tartalmaz, akkor onchangemindegyikhez a megfelelő attribútum hozzáadása (és szükség esetén későbbi módosítása) időigényes eljárás lehet.
A nem feltűnő megoldás az eseménykezelők programozott telepítése. Ezt általában úgy érik el, hogy logikailag szétválasztják az egyik vagy másik kezelőt igénylő elemeket egy osztályba, majd ezt követően feldolgozzák:
<input type= "text" class= "validatedDate" />A szkript képes megnézni az osztályhoz kapcsolódó összes bemeneti elemet, validatedDateés beállíthatja a kívánt kezelőt:
ablak . betöltés = function () { var inputs , i ; bemenetek = dokumentum . getElementsByTagName ( 'input' ); for ( i = 0 ; i < bemenetek . hossza ; i ++ ) { if ( inputs [ i ]. className == 'validatedDate' ) { inputs [ i ]. onchange = function () { validateDate (); }; } } }; függvény valideDate (){ // kezelő logika }A következő szkript a jQuery JavaScript könyvtárra vonatkozik :
$ ( dokumentum ). ready ( function (){ $ ( 'input.validatedDate' ). bind ( 'change' , validateDate ); }); függvény valideDate (){ // kezelő logika }Mivel az attribútum classaz elem szemantikai szerepét tükrözi, ez a megközelítés jól illeszkedik a W3C jelenlegi szabványokon alapuló ajánlásaihoz.