Nume Tutorial: Obiectul window - part. 1
Descriere: Obiectul window - part. 1v
Download: -
Autor: Anonim
Sursa (Link-ul oficial): -
Propria parere: Folositor.
Tutorialul:
Ferestrele sunt cele mai importante elemente de interfaţă în browser, iar JavaScript oferă multe modalităţi de a le manipula.
În această lecţie veţi învăţa despre obiectul window, proprietăţile şi metodele acestuia, cum să creaţi noi ferestre (pop-up) şi să le închideţi.
1. Proprietăţile şi metodele obiectului window.
Un browser (indiferent de nume sau producător) este prezentat într-o fereastră şi tot ceea ce utilizatorul face cu browserul se execută în interiorul acelei ferestre. Toate elementele unei pagini web sunt de asemenea conţinute în fereastra respectivă.
Obiectul "Window" este considerat obiectul de nivel ierarhic cel mai înalt în ierarhia obiectelor JavaScript pe partea de client şi conţine toate celelalte obiecte pe partea de client (cu excepţia obiectului "navigator", conceptual diferit, nefiind un element propriu-zis vizual). După cum în practică se poate lucra cu mai multe ferestre deschise simultan, la fel se poate lucra şi cu mai multe obiecte "Window" (de fapt câte unul pentru fiecare fereastră). Obiectul "Window" se creează automat atunci când se deschide o nouă fereastră de browser. Atenţie să nu confundaţi ferestrele distincte de browser cu cadrele (frame-urile), care de asemenea mai sunt numite ferestre (fiind de fapt subferestre ale ferestrei de browser).
Ca şi celelalte obiecte şi "Window" are o serie de proprietăţi şi metode. Fiind obiectul de nivelul cel mai înalt unele dintre acestea pot fi apelate sau se poate face referire la ele fără a folosi în faţa lor expresia "window." (cum e de exemplu metoda "alert()").
Obiectul window are următoarele proprietăţi:
- closed - specifică dacă instanţa "window" a fost închisă
- crypto - permite accesul la caracteristicile de criptare din Netscape
- defaultStatus - specifică mesajul prestabilit în bara de stare a ferestrei
- document - menţionează toate informaţiile despre documentul din această fereastră
- frames - menţionează toate informaţiile despre cadrele din această fereastră
- history - menţionează adresele URL vizitate de utilizator în fereastra curentă
- innerHeight - conţine înalţimea în pixeli a zonei afişate din fereastra curentă
- innerWidth - conţine lăţimea în pixeli a zonei afişate din fereastra curentă
- length - reprezintă numărul de cadre din fereastra curentă
- location - conţine adresa URL curentă încărcată în browser
- locationbar - face referire la bara de locaţie a browserului
- locationbar.visible - conţine valoarea booleană care indică dacă bara de locaţie de pe browserul utilizatorului este vizibilă
- menubar - face referire la bara de meniuri a browserului
- menubar.visible - conţine valoarea booleană care indică dacă bara de meniuri de pe browserul utilizatorului este vizibilă
- name - conţine numele ferestrei
- offscreen-Buffering - conţine o valoare booleană care ne permite să determinăm dacă vreo actualizare a ferestrei este executată într-un buffer din afara ecranului
- opener - conţine numele ferestrei din care a fost deschisă o fereastră secundară
- outerHeight - conţine înălţimea în pixeli a suprafeţei din exteriorul ferestrei curente
- outerWidth - conţine lăţimea în pixeli a suprafeţei din exteriorul ferestrei curente
- pageXOffset - conţine coordonata X a ferestrei curente
- pageYOffset - conţine coordonata Y a ferestrei curente
- parent - face referire la fereastra de nivelul cel mai înalt care afişează cadrul curent
- personalbar - menţionează informaţii despre bara personală a browserului
- personalbar.visible - conţine valoarea booleană care indică dacă bara personală de pe browserul utilizatorului este vizibilă
- screenX - face referire la coordonata X a browserului, din marginea stângă a ferestrei (Netscape)
- screenY - face referire la coordonata Y a browserului din marginea de sus a ferestrei
- scrollbars - face referire la barele de derulare ale browserului
- scrollbars.visible - conţine valoarea booleană care indică dacă barele de derulare de pe browserul utilizatorului sunt vizibile
- self - face referire la fereastra curentă
- status - face referire la mesajul de pe bara de stare a ferestrei
- statusbar - face referire la bara de stare a browserului
- statusbar.visible - conţine valoarea booleană care indică dacă bara de stare a browserului utilizatorului este vizibilă
- toolbar - face referire la bara de instrumente a browserului
- toolbar.visible - conţine valoarea booleană care indică dacă bara de instrumente a browserului utilizatorului este vizibilă
- top - face referire la fereastra de nivelul cel mai înalt care afişează cadrul curent
- window - face referire la fereastra curentă
Obiectul window are următoarele metode:
- atob() - decodifică un şir care a fost codificat în baza 64
- alert() - afişează o fereastră de avertizare cu un anumit şir de text
- back() - încarcă o pagină anterioară vizitată în fereastra curentă
- blur() - dezactivează o fereastră
- btob() - codifică un şir în baza 64
- captureEvents() - stabileşte ca fereastră să captureze toate evenimentele de un tip specificat
- clearInterval() - şterge intervalul stabilit cu metoda "setInterval()"
- clearTimeout() - şterge pauza stabilită cu metoda "setTimeout()"
- close() - închide fereastra
- confirm() - afişează o fereastră de confirmare
- crypto.random() - generează un şir aleator de date, a cărui lungime este specificată de numărul de octeţi transferaţi
- crypto.signText() - întoarce un şir de date codificate care reprezintă un obiect semnat
- disableExternalCapture() - dezactivează capturarea unui eveniment extern
- enableExternalCapture() - activează capturarea unui eveniment extern pentru paginile încărcate din alte servere
- find() - afişează o casetă de dialog "Find" în care utilizatorul poate introduce text pentru căutare în pagina curentă
- focus() - activează instanţa "window" specificată
- forward() - încarcă următoarea pagina în locul paginii curente din fereastră
- handleEvent() - apelează handlerul pentru evenimentul specificat
- home() - încarcă pagina de baza specificată a utilizatorului în locul paginii curente din browser
- moveBy() - deplasează fereastra cu valoarea specificată
- moveTo() - deplasează fereastra în locaţia specificată
- open() - deschide o nouă instanţă a unei ferestre
- print() - apelează caseta de dialog "Print" astfel ca utilizatorul să poată tipări fereastra curentă
- prompt() - afişează o fereastră cu caseta de dialog "prompt"
- releaseEvents() - eliberează evenimentele capturate de un tip specificat
- resizeBy() - redimensionează fereastra cu valoarea specificată
- resizeTo() - redimensionează fereastra la valoarea indicată
- routeEvent() - transferă evenimentele de un tip specificat pentru a fi tratate nativ
- scroll() - derulează documentul în fereastră până la o locaţie specificată
- scrollBy() - derulează documentul în fereastră cu o valoare specificată
- scrollTo() - derulează documentul pe lăţime şi înălţime până la o locaţie specificată din fereastră
- setHotKeys() - permite comutarea între activarea şi dezactivarea tastelor de selectare rapidă când nu sunt prezente meniuri
- setInterval() - apelează o funcţie sau evaluează o expresie la intervale de timp (constând într-un anumit număr de milisecunde)
- setResizeable() - permite specificarea posibilităţii redimensionării unei ferestre
- setTimeout() - apelează o funcţie sau evaluează o expresie după un anumit număr de milisecunde
- setZOptions() - permite specificarea aşezării în ordinea Z (tridimensională) a unei ferestre
- stop() - opreşte fereastra curentă să încarce alt element în ea
2. Crearea ferestrelor pop-up (metoda open).
Folosind JavaScript puteţi deschide o nouă fereastră în care se încarcă o pagină HTML, cu dimensiuni, poziţie şi proprietăţi stabilite de dv. Aceste ferestre mai sunt numite şi ferestre pop-up.
Pentru a crea o astfel de fereastră puteţi folosi metoda "open", având următoarea sintaxă:
open("URL", "nume", "proprietăţi")
Unde :
- URL - reprezintă adresa documentului care va fi afişat în fereastră (e opţional)
- nume - este un şir care specifică numele ferestrei (e opţional)
- proprietăţi - este o listă de proprietăţi ale ferestrei (dimensiune, poziţionare, şi altele). (e opţional) Proprietăţile trebuie să fie separate prin virgulă şi fără spaţii între ele.
Următorul script deschide o nouă fereastră (numită şi pop-up) care are dimensiunile 400x300 pixeli. Fereastra nu are bară de instrumente, bară de stare sau bară de meniu şi va fi deschisă la o distanţă de 200 pixeli faţă de marginea din stânga şi 100 pixeli faţă de marginea de sus.
- Butonul "Deschide fereastra" apelează, la click, funcţia "open_window()" care prin variabila "fereastra" execută metoda "open()", aceasta va deschide o fereastră nouă cu proprietăţile adăugate în metodă.
- Când apăsaţi pe buton, se va deschide o fereastră pop-up cu proprietăţile specificate în metoda "open()".
3. Închiderea ferestrelor (metoda close).
Pentru închiderea unei ferestre se foloseşte metoda close(). În fereastra pe care dorim să o închidem cu această metodă adăugăm un element de legătură (link) sau un buton în care adăugăm un eveniment "onClick" care execută metoda "close()" (sau "self.close()"), ca în exemplul următor:
sau
Cele două elemente de închidere a ferestrei au fost adăugate în pagina care se deschide cu fereastra pop-up din exemplul anterior.
Descriere: Obiectul window - part. 1v
Download: -
Autor: Anonim
Sursa (Link-ul oficial): -
Propria parere: Folositor.
Tutorialul:
Ferestrele sunt cele mai importante elemente de interfaţă în browser, iar JavaScript oferă multe modalităţi de a le manipula.
În această lecţie veţi învăţa despre obiectul window, proprietăţile şi metodele acestuia, cum să creaţi noi ferestre (pop-up) şi să le închideţi.
1. Proprietăţile şi metodele obiectului window.
Un browser (indiferent de nume sau producător) este prezentat într-o fereastră şi tot ceea ce utilizatorul face cu browserul se execută în interiorul acelei ferestre. Toate elementele unei pagini web sunt de asemenea conţinute în fereastra respectivă.
Obiectul "Window" este considerat obiectul de nivel ierarhic cel mai înalt în ierarhia obiectelor JavaScript pe partea de client şi conţine toate celelalte obiecte pe partea de client (cu excepţia obiectului "navigator", conceptual diferit, nefiind un element propriu-zis vizual). După cum în practică se poate lucra cu mai multe ferestre deschise simultan, la fel se poate lucra şi cu mai multe obiecte "Window" (de fapt câte unul pentru fiecare fereastră). Obiectul "Window" se creează automat atunci când se deschide o nouă fereastră de browser. Atenţie să nu confundaţi ferestrele distincte de browser cu cadrele (frame-urile), care de asemenea mai sunt numite ferestre (fiind de fapt subferestre ale ferestrei de browser).
Ca şi celelalte obiecte şi "Window" are o serie de proprietăţi şi metode. Fiind obiectul de nivelul cel mai înalt unele dintre acestea pot fi apelate sau se poate face referire la ele fără a folosi în faţa lor expresia "window." (cum e de exemplu metoda "alert()").
Obiectul window are următoarele proprietăţi:
- closed - specifică dacă instanţa "window" a fost închisă
- crypto - permite accesul la caracteristicile de criptare din Netscape
- defaultStatus - specifică mesajul prestabilit în bara de stare a ferestrei
- document - menţionează toate informaţiile despre documentul din această fereastră
- frames - menţionează toate informaţiile despre cadrele din această fereastră
- history - menţionează adresele URL vizitate de utilizator în fereastra curentă
- innerHeight - conţine înalţimea în pixeli a zonei afişate din fereastra curentă
- innerWidth - conţine lăţimea în pixeli a zonei afişate din fereastra curentă
- length - reprezintă numărul de cadre din fereastra curentă
- location - conţine adresa URL curentă încărcată în browser
- locationbar - face referire la bara de locaţie a browserului
- locationbar.visible - conţine valoarea booleană care indică dacă bara de locaţie de pe browserul utilizatorului este vizibilă
- menubar - face referire la bara de meniuri a browserului
- menubar.visible - conţine valoarea booleană care indică dacă bara de meniuri de pe browserul utilizatorului este vizibilă
- name - conţine numele ferestrei
- offscreen-Buffering - conţine o valoare booleană care ne permite să determinăm dacă vreo actualizare a ferestrei este executată într-un buffer din afara ecranului
- opener - conţine numele ferestrei din care a fost deschisă o fereastră secundară
- outerHeight - conţine înălţimea în pixeli a suprafeţei din exteriorul ferestrei curente
- outerWidth - conţine lăţimea în pixeli a suprafeţei din exteriorul ferestrei curente
- pageXOffset - conţine coordonata X a ferestrei curente
- pageYOffset - conţine coordonata Y a ferestrei curente
- parent - face referire la fereastra de nivelul cel mai înalt care afişează cadrul curent
- personalbar - menţionează informaţii despre bara personală a browserului
- personalbar.visible - conţine valoarea booleană care indică dacă bara personală de pe browserul utilizatorului este vizibilă
- screenX - face referire la coordonata X a browserului, din marginea stângă a ferestrei (Netscape)
- screenY - face referire la coordonata Y a browserului din marginea de sus a ferestrei
- scrollbars - face referire la barele de derulare ale browserului
- scrollbars.visible - conţine valoarea booleană care indică dacă barele de derulare de pe browserul utilizatorului sunt vizibile
- self - face referire la fereastra curentă
- status - face referire la mesajul de pe bara de stare a ferestrei
- statusbar - face referire la bara de stare a browserului
- statusbar.visible - conţine valoarea booleană care indică dacă bara de stare a browserului utilizatorului este vizibilă
- toolbar - face referire la bara de instrumente a browserului
- toolbar.visible - conţine valoarea booleană care indică dacă bara de instrumente a browserului utilizatorului este vizibilă
- top - face referire la fereastra de nivelul cel mai înalt care afişează cadrul curent
- window - face referire la fereastra curentă
Obiectul window are următoarele metode:
- atob() - decodifică un şir care a fost codificat în baza 64
- alert() - afişează o fereastră de avertizare cu un anumit şir de text
- back() - încarcă o pagină anterioară vizitată în fereastra curentă
- blur() - dezactivează o fereastră
- btob() - codifică un şir în baza 64
- captureEvents() - stabileşte ca fereastră să captureze toate evenimentele de un tip specificat
- clearInterval() - şterge intervalul stabilit cu metoda "setInterval()"
- clearTimeout() - şterge pauza stabilită cu metoda "setTimeout()"
- close() - închide fereastra
- confirm() - afişează o fereastră de confirmare
- crypto.random() - generează un şir aleator de date, a cărui lungime este specificată de numărul de octeţi transferaţi
- crypto.signText() - întoarce un şir de date codificate care reprezintă un obiect semnat
- disableExternalCapture() - dezactivează capturarea unui eveniment extern
- enableExternalCapture() - activează capturarea unui eveniment extern pentru paginile încărcate din alte servere
- find() - afişează o casetă de dialog "Find" în care utilizatorul poate introduce text pentru căutare în pagina curentă
- focus() - activează instanţa "window" specificată
- forward() - încarcă următoarea pagina în locul paginii curente din fereastră
- handleEvent() - apelează handlerul pentru evenimentul specificat
- home() - încarcă pagina de baza specificată a utilizatorului în locul paginii curente din browser
- moveBy() - deplasează fereastra cu valoarea specificată
- moveTo() - deplasează fereastra în locaţia specificată
- open() - deschide o nouă instanţă a unei ferestre
- print() - apelează caseta de dialog "Print" astfel ca utilizatorul să poată tipări fereastra curentă
- prompt() - afişează o fereastră cu caseta de dialog "prompt"
- releaseEvents() - eliberează evenimentele capturate de un tip specificat
- resizeBy() - redimensionează fereastra cu valoarea specificată
- resizeTo() - redimensionează fereastra la valoarea indicată
- routeEvent() - transferă evenimentele de un tip specificat pentru a fi tratate nativ
- scroll() - derulează documentul în fereastră până la o locaţie specificată
- scrollBy() - derulează documentul în fereastră cu o valoare specificată
- scrollTo() - derulează documentul pe lăţime şi înălţime până la o locaţie specificată din fereastră
- setHotKeys() - permite comutarea între activarea şi dezactivarea tastelor de selectare rapidă când nu sunt prezente meniuri
- setInterval() - apelează o funcţie sau evaluează o expresie la intervale de timp (constând într-un anumit număr de milisecunde)
- setResizeable() - permite specificarea posibilităţii redimensionării unei ferestre
- setTimeout() - apelează o funcţie sau evaluează o expresie după un anumit număr de milisecunde
- setZOptions() - permite specificarea aşezării în ordinea Z (tridimensională) a unei ferestre
- stop() - opreşte fereastra curentă să încarce alt element în ea
2. Crearea ferestrelor pop-up (metoda open).
Folosind JavaScript puteţi deschide o nouă fereastră în care se încarcă o pagină HTML, cu dimensiuni, poziţie şi proprietăţi stabilite de dv. Aceste ferestre mai sunt numite şi ferestre pop-up.
Pentru a crea o astfel de fereastră puteţi folosi metoda "open", având următoarea sintaxă:
open("URL", "nume", "proprietăţi")
Unde :
- URL - reprezintă adresa documentului care va fi afişat în fereastră (e opţional)
- nume - este un şir care specifică numele ferestrei (e opţional)
- proprietăţi - este o listă de proprietăţi ale ferestrei (dimensiune, poziţionare, şi altele). (e opţional) Proprietăţile trebuie să fie separate prin virgulă şi fără spaţii între ele.
Următorul script deschide o nouă fereastră (numită şi pop-up) care are dimensiunile 400x300 pixeli. Fereastra nu are bară de instrumente, bară de stare sau bară de meniu şi va fi deschisă la o distanţă de 200 pixeli faţă de marginea din stânga şi 100 pixeli faţă de marginea de sus.
Code:
<script type="text/javascript">
<!--
function open_window() {
fereastra = open("pagina.html", "numeFereastra", "width=400,height=300,
left=200,top=100,status=no,toolbar=no,menubar=no");
}
//-->
</script>
<form>
<input type="button" value="Deschide fereastra" onclick="open_window()">
</form>- Butonul "Deschide fereastra" apelează, la click, funcţia "open_window()" care prin variabila "fereastra" execută metoda "open()", aceasta va deschide o fereastră nouă cu proprietăţile adăugate în metodă.
- Când apăsaţi pe buton, se va deschide o fereastră pop-up cu proprietăţile specificate în metoda "open()".
3. Închiderea ferestrelor (metoda close).
Pentru închiderea unei ferestre se foloseşte metoda close(). În fereastra pe care dorim să o închidem cu această metodă adăugăm un element de legătură (link) sau un buton în care adăugăm un eveniment "onClick" care execută metoda "close()" (sau "self.close()"), ca în exemplul următor:
Code:
<a href="#" onclick="self.close()">Inchide</a>sau
Code:
<form>
<input type="button" value="Inchide" onclick="self.close()">
</form>Cele două elemente de închidere a ferestrei au fost adăugate în pagina care se deschide cu fereastra pop-up din exemplul anterior.
Code:
open() si close() sunt metode ale obiectului "window". Normal am scrie window.open() si window.close(), dar obiectul "window" este o exceptie. Nu trebuie scris cuvantul "window" daca se apeleaza o metoda a unui obiect fereastra (aceasta este valabil numai pentru obiectul window).