Ciprian-Danie!NEAGU, DanielaNEAGU -oFilmellisecvente de tipMacromediaFlash/Shockwave sunt fo!ositepentruprezentaricecombinatextul,grafica, secventeleaudio~ ivideopentrurealizareaaplicatiilor interactive (figura 3-21, http://wVv.W.macromedia.com). Figura 3-22.Website-ul consortiufui VRML oVRML(VirtualReality Make-up Language) este 0extensie a HTML.Aceastapermite 0realizare analogaHTML In s p a ~ i u l 3D(figura3-22).Pentruvizualizare,sefolosescbrowser-e speciale VRML saubrowsere HTML cuunplug-in VRML. Figura3-23.Legatura catre adresa unei apficatii plug-in,in pagini cu atribute speciale. 70 un Ciprian-Daniel NEAGU. DanielaNEAGU PorninddelastructuraHTMLdebazadescrisainsectiunea precedenta,vomparcurgeurmatoareleetapepentrua1mbog .. impuncabutonu! submi tsa fie tratat ca buton separat. Your full name: Your e-mail address: I Figura 4-20.0simpla forma HTML. Obsetvafie:Celemai multeetichete HTML(ca, ,
I E-mailaddress: Iwasimpressedbythestyleandpresentation. Pleaseaddanyothercomments: Ithinkyourbrochureis: 99 Ciprian-DanielNEAGU.Daniel_8_N_E_A_G_'_U_____. Please tellus what you thoughtof thisWebsite.Select the checkbozes which you agree wiih' rThe text was understandable. rI found it easy tofind my way through the Website. rI was impressed by the style and presentation, IIthinkyourbrochureis: pre,." odd "'" ""'" ,--L Figura 4-22.Unexemplu deutilizare a componente/or: checkboxes,hidden fields,text area. TYPE=IMAGE EtichetadeformaINPUTTYPE=ItFlAGEestesimilaraetichetei IMG.Folosirea eiare earezultat a f i ~ a r e aimaginii de lalocatia SRC cuoptiunea ALIGN.0a stfe I de formaare douacaraGteristicice0 fac utMt iadiepeimage,date Ieformeicompletatesunttransmise analog unei componenteINPUTTYPE=SUBMIT; permite utilizatorului sa aleaga 0portiune dinimagine. Coordonatele in pixeliale punctuluiales de utilizator,identificatorii image-id.x iimage-id.y (abscisa este transmisa cafiindcontinutul atributuluiNAt'VJE.xiarordonatacaNAME. y).sunttransmise impreuna cudate!e formeL 100 ______O_i_llt_ro_ducerepractica In HTML ExemplulurmatorilustreazafolosireauneicomponenteINPUT TYPE=IMAGEcaunbutonSubmitpersonaiizat(figura4-23) dar, Ingeneral,multesite-urifolosesccaracteristicareferitoarela coordonatele in pixelipentrua prezentameniuri grafice, tabele de butoanesauMrti denavigarein site.Comportareaestesimilara etichetei referitoare laharta de imagini. Choosewhichsoftwaretodownload: Textviewer Imageviewer Movieplayer Soundplayer Mediaeditor IBMpccompatible Macintosh(68000) Macintosh{Powerpc} License Media Documentation Figura 4-23.Cutii deselecfie i butoane imagini. 101 Ciprian-Daniel NEAGU,Daniela NEAGU f!NPUT TYPE=HIDDEN ---------1 EtichetaINPUTTYPE=HIDDENeste 0formaneuzuala, Insensu I canuapareinformaHTMLafil?ata,fiind0convenlieprincare proiectantultrimiteatributulVALUEcadataaformei,inspecial dacaprogramuldeprelucrareestespecificat InatributulACTION almai multor forme. Unexemplu(figura4-24)alutilizariicomponenteiINPUT TYPE=HIDDEN este i1ustrat in continuare: Inorderthatwemaycontinuetoprovidea highqualityWorldWideWebservice,pleasetake thetimetofillinthisform. Yoursurname(familyname): Yourfirstname(givenname): Yourtitle: [ [ Miss. ] [Dr.] [ Myhomepage images-{O] elements[O] Name:...... !, e-Mail:,.\_ ... f(Jrms[O} elements{ lj /images{l} .............. .L.J.IJ.i..I.] My homepage -""linksfO] Figura 5-5.Un exempfu de document HTML pentru ierarhia JavaScript. Documentulconlinedouaimagini,0hyperlegatura!1i0formacu doua text !1iun buton.Dinpunctul de vedere al ierarhizarii JavaScript,fereastrabrowser-uluiesteunobiectwindow.Acest obiect contine anumite elemente (de exemplu, bara de stare). Intr-oastfeldefereastra,poatefiincarcata0paginaHTML.0astfel depaginaesteconsiderataunobiectdocument.Cualtecuvinte, obiectuldocumentreprezintadocumentulHTMLcurent,incarcat debrowser.Unobiectdocumentestecaracterizatdeproprietati specifice,spreexempluculoareadefundalapaginii.Toate obiecteleHTML(hyperlegaturi,forme,imaginiinserate)sunt considerateproprietalialeobiectuluidocument.ierarhia JavaScriptcreatapentrudocumentuldescrisanterioreste evidentiata in figura5-6. 112 Aplica\ii JavaScript pentru dinamizarea paginilor HTML docmnent hiM!.- page links[O] th.link elements[O] Figura5-6.lerarhia JavaScript a unui document HTML. Dinierarhiaprezentatainfjgura5-6putemidentificanumele implicitalobiectelordocumentuluiHTMLSpreexemplu, adresareaimaginiidindocumentseobtineastfel:plecanddin varfulierarhiei,primuldocument estedocument.Pentruaajunge laprimaimagineadocumentului,trebuiesaaccesamvectorul images,deciimages[O].Prinurmare,accesulprincodJavaScript a imaginii din document se realizeaza cudocumenUmages[O}. Pentrua putea folosice aintrodus utilizatorul in primulelement al formei HTML. va trebui.similar,saidentificam calea de accesare a acestuielement,dinierarhie.Pornindsinva rfu Iieramiei,yom urmacaleacatreprimulelementprinvectorulelements,prin urmare:document.forms[O}.elements[O].Ramanesaidentificam aceaproprietateaunuielementtextaluneiformeHTMLcare conlinevaloarealui:value.Tnconcluzie,Iiniadecodcarepreia valoarea introdusa de utilizator in elementul cusemnificatia Name este: name=document.forms[O]. elements [0].value; ~ i r u lrespectivestememorat in variabilaJavaScript name.Putem safolosimaceasta variabila in continuare,spre exemplupentrua returna 0formula de salut: alert ("Hi"+name). Cutoatasimplitatea~ iclaritateaierarhieiJavascript.arputeafi destul de greoi sa adresam prin indici numerici componentele unui documentHTMLcumulteelemente,spreexemplu: document.forms[3}.elements[17}.0astfeldeproblemaserezolva prin atributul unic NAME al fiecarui obiect HTML, Spre exemplu, In documentul considerat: Name:
113 Clprian-Daniel NEAGU, Daniela NEAGU Prinurmare,forms[O]poatefiaccesata prinmyForm.Putem astfelsa inlocuim: name=document.forms[O]. elements (0].value; cu: name=document.myForm.name.valuei Modalitatea de accesare devine astfel mai ul?oara 9ipersonalizata, ma;alesincazulpaginilorcumulteobiecte,respectandinsacu strictetedenumireaatribuitaobiectelor(nusepoate,spre exemplu.folosimyform Tnloc demyForm).Proprietatile obiectelor HTML,accesateprinierarhiaJavaScriptpotfifolositeatatIn operaliideatribuire,citiresaucalcuLSpreexemplu,inmomentul creariiunuidocument,sepoateatribui0valoareinitialaimplicita unui element text alformei: