1 / 37

Javascript

Javascript. Programim ne Web Leksion 12. JavaScript. JavaScript është një gjuhë skriptimi për faqet e Web-it. Skriptet e shkruara me JavaScript mund të futen në faqet HTML Me JavaScript ju keni shumë mundësira për pasurimin e faqeve tuaja me elementë të rinj dhe interesantë .

dayo
Télécharger la présentation

Javascript

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Javascript Programim ne Web Leksion 12 Iralda Mitro

  2. JavaScript • JavaScript ështënjëgjuhëskriptimipërfaqet e Web-it. • Skriptet e shkruara me JavaScript mundtëfutennëfaqetHTML • Me JavaScript jukenishumëmundësirapërpasurimin e faqevetuaja me elementëtërinjdheinteresantë. • Përshembulljujeninëgjendjetipërgjigjeningjarjeveqëshkaktohenngapërdoruesi fare thjesht. • Disaefekteqëtanimundtëbëhen me JavaScript mëpërparamundtëbëheshinvetëm me CGI. • Me ndihmëne JavaScript jumundtëkrijonifaqeWebimjafttësofistikuara. Iralda Mitro

  3. Variablat dhe emrat e funksioneve • Si programuesduhettezgjedhimemrat per variablatdhefunksionet. • Emrat e variablavedhefunksioneveduhettendjekinrregullat e meposhtme: • Karakterii pare duhettejetenjeshkronjealfabeti (e madheose e vogel), nje (_), oseshenjedollari($). • Nukmundteperdorninjenumersishkronjetepare. • Emratnukduhettepermbajnehapesira. • Emratnukduhettejenendonjengafjalet e rezervuarategjuhes. Iralda Mitro

  4. Variablat dhe emrat e funksioneve Shembujemrashtevlefshem: • x • Numri_tjeter • x20 • _totali • $shuma_string Iralda Mitro

  5. Variablat dhe emrat e funksioneve • Rekomandohetteperdorenemrapershkrues per variablatdhefunksionetdheteperdoretnjemenyrestandarte e emertimittetyre. • Shembuj • add_two_num • addTwoNumbers Javascriptperdortedyten. Iralda Mitro

  6. Fjalet e rezervuara • Ka njenumerfjaleshqeperbejnekomponentete gjuhesJavascript. • Ketofjalenukmundteperdoren per emravariablashdhefunksioneshsepsekompilatorinukmundtedallojenjekomande default teJavascriptngaemriifunksionitapovariablit tone. Iralda Mitro

  7. JavaScript • Javascriptvendosetbrenda tag-eve <SCRIPT>. • Javascripteshte case-sensitive. • CdoinstruksionJavascriptmbaron me pikepresje (;). • Javascriptinjoronhapesirat. Iralda Mitro

  8. Deklarimiivariablave • Variablieshtenjeemerqeicaktohetnjevendi ne memorie per teruajturtedhena. • Para se teperdorninjevariabel ne nje program Javascript, duhettadeklaroni. • Variablatdeklarohen me fjalenvarsi: • var x; • var y; • var sum; • Mundtedeklarojmeshumevariabla me tenjejtenfjalevar: • var x, y, sum; Iralda Mitro

  9. Deklarimiivariablave • Mundtekombinojmedeklarimtevariablave me inicializimtetyre: • var x=1, y=3, sum=0; • Nqsnukspecifikojmenjevlereinicializuesetevariablavekurideklarojmeato, vlera e tyrefillestareeshtenjevlere e papercaktuarJavascript. • Javascript case-sensitive => x dhe X dyemravariablashtendryshem. Iralda Mitro

  10. Tipet e variablave • Njediference e madhendermjetJavascriptdhegjuhevetetjerasi JAVA, C eshteqeJavascripteshte pa tip (untyped). • Kjo do tethoteqenjevariabelJavascriptmundtembajenjevleretecdo tipi tedhenash, dhe tipi itedhenavenukduhettevendosetkurdeklarohetvariabli. • Kjolejontendryshohet tipi itedhenavetevariablitgjateekzekutimitteprogramit, psh: var x=10; x=“ten”; • Ne keteshembullvariabli x ne fillim ka marrevleren e njenumriteplote 10, pastajtenjestringu. Iralda Mitro

  11. Perdorimiioperatoreve • Operatoretjaneatoqeveprojnembivariablat. var x=1, y=3, sum=0; sum=x+y • Operatoretetjereperdoren per krahasim varx=1, y=3, sum=0; if (sum==0) { sum=x+y; } Iralda Mitro

  12. Operatoret e Javascript • Llogarites • (-) – negativizimiunar • (++) – inkrementimi • (--) – dekrementimi • (*) – shumezimi • (/) – pjesetimi • (%) – mbetjaaritmetike • (+) – mbledhja • (-) – zbritja Iralda Mitro

  13. Operatoret e Javascript • Logjik • (!) – Not logjik • (>) • (<) • (<=) • (>=) • (==) • (!=) – e ndryshme • (&&) – And logjik • (||) – Or logjik Iralda Mitro

  14. Operatoret e Javascript • Vleredhenia • (=) – vleredhenia • Operatoreteperberetevleredhenies • (+=) – mbledhja • (-=) – zbritja • (*=) – shumezimi • (/=) – pjesetimi • (%=) – mbetjaaritmetike Iralda Mitro

  15. Strukturat e kontrollit(Ciklet& Degezimet) • If if ((x==1) && (y==3)) { sum = y-x; } if (sum==0) { sum = x+y; } else { subtotal = sum; } Iralda Mitro

  16. Strukturat e kontrollit(Ciklet & Degezimet) • Switch switch (n) { case 1://instruksione break; case 2://instruksione break; default://instr. nqstetjeratnukplotesohen break; } Iralda Mitro

  17. Strukturat e kontrollit(Ciklet & Degezimet) • while • Perdoretkurnukdisa here duhetteciklosh, pordiqeduhetndaluarkurndeshetkondita. var x=1; while (x<=10) { //derisa x me imadh se 10 //instruksione x++; } Iralda Mitro

  18. Strukturat e kontrollit(Ciklet & Degezimet) • for • Perdoretkurdisaktesishtsa here duhetteciklosh. var x; for (x=1; x<=10; x++) { //instruksione } Iralda Mitro

  19. Objektet, Eventet, DOM • Objektet • Operatori new • DOM (Document Object Model) • Array • Eventet • onClick • onSubmit • onMouseOver • onMouseOut • onFocus • onChange • onBlur • onLoad • onUnload Iralda Mitro

  20. Objektet • Njeobjekteshtenjekoleksionvariablash (parametrash) dhefunksionesh (metodash). • Sintaksa e perdorimittenjeobjektieshte: objekt.parameteroseobjekt.method(). • Nje string eshtenjeobjekt ne Javascriptdhe ka disametodadheparametra. varStringVar=new String(“Leksion”); varx=StringVar.length;//gjatesia varx=StringVar.toUpperCase(); //kthen ne shkronjatemedha. Iralda Mitro

  21. Objektet • Javascript ka objektet e meposhtmetendertuara: String, Math, Date, Array. • Objektistring ka njenumermetodash per manipulimin e stringjeve. • Objektimatheshtenjekoleksionmetodashdhevecorish per tekryerveprimearitmetikesi min(), max(), sin(), cos() etj. • Objektidateeshtenjekoleksionmetodash per tepunuar me datatdhekohen. • Objektiarrayilejonprogramatorettekrijojnekoleksione me tedhena. Iralda Mitro

  22. Objektet - Operatorinew • Objektetdhe array nukmundvetemteshtypen ne programeJavascript. Ata duhettekrijohen. • Ne perdorimoperatorinnew per tekrijuarnje instance te re tenjeobjektiosetenje array. • Ndryshethemiqeoperatorinewkrijonnje kopje tenjeobjektiekzistuesosetenjestrukture array dheivendosimpastajemrinqedeshirojme. • Sintaksaeshte: o=new Object(); • Meqeobjektetjanetendertuar me metoda (funksione) dheparametra (variabla), objektiiriikrijuar “o” ne keterast ka tegjithametodatdheparametrat e objektitorigjinal. Parametratvendosen ne vlerat e tyre default. Iralda Mitro

  23. DOM (Document Object Model) • Browser-inasiguronnjeseriobjektesh. • Dritarja e browser-it kushfaqetfaqjanjihetsiobjektidritare (window object). • Faqja HTML e paraqiturnga browser-injihetsiobjektidokument (document object). • Objektidokumenteshte me iperdoruri ne client-side Javascript. • Elementet HTML qe ne ishtojmenjefaqejegjithashtuzgjerojnehierarkine e objekteve. Iralda Mitro

  24. DOM • Njeshembulleshtenjeformedheelementetqendodhen ne forme. Kjo do tethoteqemundt’ireferohemiobjektevesi me poshte: • window.document.forms[0] • ireferohetformes se pare ne dokument. • Format janeteimplementuarasi array ne DOM. • Nqskemi me shume se 1 formene faqe, numratfillojnenga 0. • window.document.Form1 • ireferohetformes me emer Form1. • window.document.Form1.FirstName.value • ireferohetvleres se shtypur ne textbox-in tequajturFirstNameteformes se quajtur Form1. Iralda Mitro

  25. shembull <HTML> <HEAD> <TITLE> Forme e thjeshte </TITLE> </HEAD> <BODY> <FORM NAME=“Form1”> Name:<INPUT TYPE=“TEXT” NAME=“FirstName”><BR> <INPUT TYPE=“Button” VALUE=“Submit Info”> </FORM> <FORM NAME=“Form2”> Name: <INPUT TYPE=“TEXT” NAME=“LastName”><BR> <INPUT TYPE=“Button” VALUE=“Submit Info”> </FORM> </BODY> </HTML> Iralda Mitro

  26. DOM • forms[0] • ireferohetformes se pare brendaketijdokumenti. • Form1 • ireferohetformesme emer Form1 ne ketedokument. • Form1.FullName.value • ireferohetvleres se shtypur ne browser ngaklienti ne textbox-in e quajturFullName, ne formen e quajtur Form1 ne ketedokument. Iralda Mitro

  27. Array • Javascript, e ngjashme me gjuhet e tjerateprogramimit ka mundesine e perdorimittestrukturavetetedhenavetequajtura array. • Nje array eshtenjekoleksion me tedhenakucdopjese e tedhenaveeshte e mbajtur ne njepoziciontenumeruarbrendanje array. • Cdopozicioni ne nje array ijepetnje index duke filluarngazero; zero pozicionii pare, njeidytietj. • Nje array eshteimplementuarsinjeobjekt ne Javascriptdhemundtekrijohet duke perdorurnew. Iralda Mitro

  28. Array var a=new Array();//krijonnje array e quajtur “a” a[0]=1.2;// ivendosvlereelementitte1re a[1]=“Javascript”;// ivendosvlereelementitte 2te Array janeterendesishem per tukuptuarsepsenjenumerkomponenteshte Document Object Model (DOM) janeimplementuarsi array si format, imazhetetj. Iralda Mitro

  29. Eventet • Eventetjanetrigeraqetherrasinnjengafunksionet tone. • ProgrametJavascript client-side nuk do teekzekutohenderisateiniciohennganje event. • Nje event mundtejetenjeveprimsiklikimi ne njebutonosevendosja e mouse-it mbinjeimazhetj. Iralda Mitro

  30. Eventet - onClick() • Njeevent click ndodhkurklikohetnjebuton, checkbox, radio buton, reset buton, submit buton. • Ky event perdoretrregullisht per butona per tefilluarekzekutimin e scriptit. • <INPUT TYPE=“Button” VALUE=“Click Me” onClick=“window.alert(‘You Clicked Me’);”> • Kurklikojmebutonin “Click Me” ekzekutohetinstruksioniJavascriptwindow.alert(‘You Clicked Me’); Iralda Mitro

  31. Eventet - onSubmit() • Njeevent submit ndodhkurperdoruesipranon (submit) njeforme. Ky event perdoretshpesh me njeformedhenjebuton submit per tefilluarekzekutimin e scriptit. <FORM action=http://form.asponSubmit=“return checkform();”> • Kurperdoruesiklikon ne butonin submit, ekzekutonfunksionincheckform(). Nqs forma kalontegjithatestet e validimit, kthehetnjevlere true dhetedhenatkalohente“form.asp”. Iralda Mitro

  32. Eventet - onMouseOver() • Njeevent onMouseOverndodhkurperdoruesipozicionon mouse-in mbinjehiperlink, osenje zone telinkuartenjeimazhite client-side. • <a href=“http://www.google.com” onMouseOver=“window.status=‘Main Search Engine on the Web!’; return true; ”>Click to search</a> • Ne keteshembullkurvendoset mouse-imbi link ne rreshtin e statusittedritares se browseritafishohetmesazhi. Iralda Mitro

  33. Eventet - onMouseOut() • Kyevent ndodhkurperdoruesiheq mouse-in ngalinkuapozona e linkuar. • <a href=“http://www.google.com” onMouseOut=“window.status=‘The number one search engine’; return true; “> Click to search </a> Iralda Mitro

  34. Eventet - onFocus() • Kyevent ndodhkurnjeperdoruesijepfokusoseklikonmbinjekontrollteformes. • <INPUT TYPE=“TEXT” NAME=“Month” onFocus=“window.status=(‘Please enter the month as two digits 01 deri 12’); return true;”> • Kurklikohet textbox-i, pramerrfokusnjemesazhparaqitet ne rreshtit e statusitte browser-it qetregon se cfareduhetteshtypet. Iralda Mitro

  35. Eventet - onChange() • Kyevent ndodhkurnjevlerendryshon ne textbox, textareaetj. <INPUT TYPE=“TEXT” NAME=“Month” onChange=“window.status=(‘The value of the Month Changed!!!’); return true;”> <INPUT TYPE=“TEXT” NAME=“Year”> Iralda Mitro

  36. Eventet - onBlur() • Kyevent ndodhkurperdoruesi le njefushe password, tekst, tekstareatenjeforme HTML. <INPUT TYPE=“TEXT” NAME=“Month” onBlur=“window.status=(‘The value of the Month Changed!!!’); return true;”> <INPUT TYPE=“TEXT” NAME=“Year”> • onChange() dheonBlur() nukperdoren ne tenjejtenkohe. Iralda Mitro

  37. Eventet - onLoad() • Kyevent ndodhkur browser-iperfundon se ngarkuarinjedokument. • <BODY onLoad=“alert(‘Welcome!’);”> • onUnload() • Ky event ndodhkurlevizim ne njedokumenttjeter. Pshkurperdorimbutonin back oseklikojme ne nje link ne njefaqetjeteretj. <BODY onUnload=“alert(‘Bye!’);”> Iralda Mitro

More Related