Nenametljiv Javaskript (енгл. Unobtrusive JavaScript ) je opšti pristup korišćenja Javaskripta za veb stranice. Iako termin nije formalno definisan, njegovi osnovni principi opšte prihvaćeno uključuju:
Javaskript je istorijski imao lošu reputaciju nezgodnog jezika neupotrebljivog za ozbiljan razvoj aplikacija.[3][4] Loša reputacija je uglavnom poticala od implementacije samog jezika koja je bila nedosledna, kao i zbog širokog korišćenja lošeg copy-and-paste koda. Greške prilikom izvršavanja su bile uobičajene (i preteške da se otkriju i poprave), pa su neki programeri čak pokušavali da ih isprave, sve dok se skript ponašao manje-više onako kako je trebalo da se ponaša.[5] Skript često nije uopšte radio u nekim pregledačima.
Neki veb programeri su promovisali elegantnu degradaciju od 1994.[6]
Nedavna pojava Javaskript okruženja, visoko-kvalitetnih alata za debagovanje i pretraživača koji zadovoljavaju veb standarde je napravila mogućim organizovan, prilagodljiv Javaskript kod, kao i pojava Ajaks interfejsa koji ga je učinio poželjnim. Nekada, Javaskript je bio rezervisan za relativno jednostavne i nekritične zadatke, a sada se koristi za pisanje velikih, kompleksnih kodova koji su često deo osnovne funkcionalnosti sajta. Greške prilikom izvršavanja i napredviđeno ponašanje više nisu ne toliko bitne mane, sada su fatalne.
Zagovornici nenametljivog Javaskripta vide to kao deo većeg napretka Veb standarda;
kao što je zahtev za kompatibilnost na različitim pregledačima doveo do sve većeg isticanja standardizovanog označavanja (енгл. markup) i stila
, tako i sve veća potražnja za bogatim Internet aplikacijama dovodi do napretka zbog bolje prakse u korišćenju Javaskripta.
Koncept nenametljivosti u sklopu Javaskript programiranja je osmišljen 2002. godine od strane Stjuarta Langridža (енгл. Stuart Langridge) u članku "Nenametljiv DHTML,i moć neuređenih listi".[7] U ovom članku Langridž se zalaže za čuvanje celog Javaskript koda, uključujući i upravljanje događajima, izvan HTML-a.
Stuart Langridge je kasnije napisao knjigu[8] u kojoj je proširio ovu misao.
Drugi autori su pokušali da poboljšaju i definišu osnovne elemente nenametljive paradigme. U svojoj knjizi Javaskript: Sveobuhvatni vodič od Dejvida Flanagana (енгл. David Flanagan) kaže da sve dok ne postoji određena formula, postoje tri glavna cilja:
Projekat veb standarda opisuje četiri koristi nenametljivog DOM skriptinga u svom Javaskript Manifestu.
Za potrebe Veb konferencije u Parizu 2007. godine, Kristijan Hajlman (енгл. Christian Heilmann ) je uočio i izdvojio sedam zakonitosti nenametljivog Javaskripta.
Event koji se prosleđuje većini upravljača za događaje.Tradicionalno, Javaskript je često bio pisan odmah uz oznake nekog HTML dokumenta. Sledeći primer je tipičan primer implementacije Javaskript potvrde obrasca, kada je napisana unutar etiketa pri elementu:
<input type="text" name="date" onchange="validateDate()" />
Pristalice "Nenametljivog Javaskripta" zastupaju mišljenje da je svrha oznaka da opiše strukturu dokumenta, a ne njegovo programsko ponašanje i da kombinovanje ova dva ima negativan uticaj na održavanje sajta, iz sličnih razloga iz kojih ima negativan uticaj i kombinovanje sadržaja i prezentacije. Oni takođe zastupaju da je linijsko upravljanje događajima(енгл. inline event handlers) teško za korišćenje i održavanje, kada neko na primer ima potrebe za postavljanjem upravljača za nekoliko događaja na jednom elementu ili kada neko želi da stavi istu obradu događaja na više elemenata, ili kada neko koristi odlaganje događaja(енгл. event). Ne mogu biti korišćeni ni sa nasumičnim događajima.
Nenametljivo rešenje je da programski unesemo neophodne izvršitelje događaja, pre nego linijski. Ovo je bolje nego da dodajemo onchange atribut eksplicitno kao iznad, bitni elementi se lako indetifikuju, na primer sa class, id ili nekim drugim načinom obeležavanja:
<input type="text" name="date" id="date" />
Skript koji se izvršava kada se stranica prvi put učita u pregledač može da potraži bitne elemente i postavi ih prema tome:
window.onload = function() {
document.getElementById('date').onchange = validateDate;
};
Nenametljiv Javaskript bi trebalo da doda što manje moguće globalnom objektu ili globalnom imenskom prostoru od okoline u kojoj se izvršava. Ostali skript jezici možda pređu preko nekih promenljivih ili funkcija koje su kreirane u globalnom imenskom prostoru, i to može dovesti do neočekivanih grešaka koje je teško debagovati. Javaskript nema ugrađen eksplicitni mehanizam za imenski prostor, ali željene efekte je lako proizvesti koristeći jezičke olakšice. Flanagan predlaže korišćenje domena imena programera, obrnutog tačkastog segmenta, kao jedinstvenim globalnim imenom za objavljivanje, u stilu razvijenom u Java jeziku.[12]
var org;
if (!org) {
org = {};
} else if (typeof org != 'object') {
throw new Error("org already exists and is not an object.");
}
if (!org.example) {
org.example = {};
} else if (typeof org.example != 'object') {
throw new Error("org.example already exists and is not an object.");
}
Dok promenljive, funkcije i objekti svih vrsta mogu biti dalje definisani unutar takvih objekata imenskog prostora, obično je preporučeno da se koriste closures unutar imenskog prostora kako bi dalje izolovali šta će postati privatne promenljive i funkcije, takođe i export koji određuje šta će biti javni interfejs svakog modula funkcionalnosti. Kod iznad može pratiti sledeće:[13]
org.example.Highlight = function() {
// Define private data and functions
var highlightId = 'x';
function setHighlight(color) {
document.getElementById(highlightId).style.color = color;
}
// Return public pointers to functions or properties
// that are to be public.
return {
goGreen: function() { setHighlight('green'); },
goBlue: function() { setHighlight('blue'); }
}
}(); //End closure definition and invoke it.
Iz bilo kog drugog modula, ovi javni metodi mogu biti pozivani na neki od sledećih načina:
org.example.Highlight.goBlue();
var h = org.example.Highlight;
h.goGreen();
Na ovaj način, svaki moduo-piščev kod sadržan u privatnom ili u jedinstvenom imenskom prostoru i ne može da se umeša sa ili da se nameće u odnosu na neki drugi kod u bilo kom trenutku.
Pisanje jednog osluškivača događaja (енгл. event listener) koji detektuje učitavanje HTML stranice i onda dodaju bitne osluškivače drugim događajima na stranici, kao i druga ponašanja koja su tražena, on može rešiti problem razdvajanja funkcionalnosti Javaskripta od HTML oznaka. Korišćenje sa klijentske strane Javaskript biblioteka kao što su jQuery, MooTools ili Prototype može olakšati ovaj proces i pomoći oko osiguravanja individualnih pregledača, tj. da njihovi implementacioni detalji budu skriveni i zadovoljeni. Držanjem većeg dela Javaskripta izvan predviđenog imenskog prostora pomaže pri osiguravanju nenametljivosti u ovom smislu. Druga obeležja nenametljivog Javaskripta koja su često pominjana su sigurnost da dodata dešavanja elegantno degradiraju na pregledačima sa neočekivanom konfiguracijom, i onima na kojima postoji mogućnost da je korisnik isključio Javaskript.[14]
Ovaj zahtev je baza mrežne pristupačnosti, da bi osigurali da veb sajtove osnažene Javaskriptom mogu koristiti svi ljudi -nevezano za platformu koju koriste- i dobiju jednak pristup svim informacijama i funkcionalnostima sajta. Ponekad je potreban dodatni posao kako bi ovo omogućili. Na primer u Engleskoj, енгл. the Equality Act 2010, govori o tome da je ilegalno diskriminasati ljude sa invaliditetom i odnosi se na bilo koga ko obezbeđuje bilo koje javne usluge, privatne i volonterske sektore.[15] Iako je dosta napora uloženo u dizajniranje i implementiranje glatke klijent-strane korisničkog interfejsa u nenametljivom Javaskriptu, on neće ostati nenametljiv korisniku bez klijentske-strane skripta, ako uvide da oni ne mogu pristupiti objavljenim informacijama. Kako bi se uspostavio ovaj cilj, obično je potrebno implementirati ekvivalent, funkcionalnost serverske-strane koja će biti dostupna bez imalo korišćenja Javaskripta.
Uzmimo za primer veb stranicu gde prikazanim slikama trebaju ponašanja u Javaskriptu kako bi se pojavila slika u punoj veličini kada se mišem pređe preko nje ili klikne. Prvo, server-strana oznaka treba da se postara da se bitne slike pune veličine prikazuju korisniku bez Javaskripta koji klikne na njihov umanjeni prikaz. U ovom slučaju HTML oznake mogu izgledati ovako:
<a href="fullsize-image-001.png" class="manual-link" title="Click for full-size image">
<img src="image-001-thumb.png" class="thumb" width="50" height="50" alt="Image 1 shows... etc">
</a>
Ovo će raditi bez Javaskripta. Nenametljiv Javaskript, u ovom slučaju, tokom učitavanja stranice, može naći sve a elemente koji imaju class manual-link i da ih uklone iz DOM stranice. Onda može naći sve slike klase thumb i dodati im onmouseover ili onclick obrađivač događaja koji je ubačen linijski kako bi osigurao glatko izvršavanje. Na primer, izvršen je neki događaj; zatim se šalje Ajaks zahtev serveru za uveličanje slike, onda se dodaje divDOM stranici traženjem da se postojeći CSS pojavi ispred postojećeg sadržaja, koji može postati delimično zatamnjen. Close dugme je potrebno div-u , možda neki vizuelni pokazivač da se strana učitava, itd. Konačno kada Ajaks podaci stignu, izvršitelj sakriva vizuelni pokazivač za učitavanje i prikazuje punu veličinu slike u novi div za prikazivanje.
Na ovaj način, sve funkcionalnosti klijent-strane zavise od iste Javaskript funkcije. Ako ta funkcija uspe, ona počinje sa uklanjanjem bazičnog, manualnog ponašanja, i dodaje skriptovano ponašanje klijent-strane. Ako skript ne radi iz nekog razloga, manualno ponašanje ostaje i ostaje njegova funkcionalnost.
Iako je suština nenametljivog Javaskripta koncept dodatnog sloja ponašanja, zagovornici ove paradigme slažu se u osnovi i sa brojnim povezanim principima, kao što su: