Ćwiczenie laboratoryjne. Obiektowy model przeglądarki (BOM, Browser Object Model)

Tematy ćwiczenia Ćwiczenie laboratoryjne Obiektowy model przeglądarki (BOM, Browser Object Model) obiekty window, frames, history, location, navigator, screen, document Wyniki opracowania zadań pokazywać za pomocą obydwóch przeglądarek: Firefox Mozilla, Internet Explorer. W przypadku stosowania Firefox Mozilla używać konsoli błędów (Narzędzia/Konsola błędów). Korzystając z Notatnika opracowywać: plik HTML (XHTML), zewnętrzny plik JS zawierający program w języku JavaScript, zewnętrzny plik CSS. a) Obiekt window Zadanie Opracować aplikację, która po naciśnięciu przycisku Okno otworzy nowe okno z właściwościami według wariantu z przytoczonej tabeli wariantów. Opracowanie zadań <skrypt> <pliki JS i CSS> Testowanie <zrzut z przeglądarki> Tabela wariantów punktu a) Np URL Zmiana rozmiarów okna Możliwość przewijania Pasek narzędzi Pasek stanu Pasek adresu 1 http://www.google.pl/ Tak Tak Tak Tak Tak 2 http://www.yahoo.com/ Tak Tak Tak Tak Tak 3 http://www.yahoo.com/ Nie Tak Tak Tak Tak 4 http://www.google.pl/ Nie Tak Tak Tak Tak 5 http://www.google.pl/ Nie Nie Tak Tak Tak 6 http://www.yahoo.com/ Nie Nie Tak Tak Tak 7 http://www.yahoo.com/ Tak Nie Tak Tak Tak 8 http://www.google.pl/ Tak Nie Tak Tak Tak 9 http://www.google.pl/ Tak Nie Nie Tak Tak 10 http://www.yahoo.com/ Tak Nie Nie Tak Tak 11 http://www.yahoo.com/ Nie Nie Nie Tak Tak 12 http://www.google.pl/ Nie Nie Nie Tak Tak

Np URL Zmiana rozmiarów okna Możliwość przewijania Pasek narzędzi Pasek stanu Pasek adresu 13 http://www.google.pl/ Nie Tak Nie Tak Tak 14 http://www.yahoo.com/ Nie Tak Nie Tak Tak 15 http://www.yahoo.com/ Tak Tak Nie Tak Tak 16 http://www.google.pl/ Tak Tak Nie Tak Tak 17 http://www.google.pl/ Tak Tak Nie Tak Tak 18 http://www.yahoo.com/ Tak Tak Nie Tak Tak 19 http://www.yahoo.com/ Nie Tak Nie Tak Tak 20 http://www.google.pl/ Nie Tak Nie Tak Tak 21 http://www.google.pl/ Nie Nie Nie Tak Tak 22 http://www.yahoo.com/ Nie Nie Nie Tak Tak 23 http://www.yahoo.com/ Tak Nie Nie Tak Tak 24 http://www.google.pl/ Tak Nie Nie Tak Tak 25 http://www.google.pl/ Tak Nie Tak Tak Tak 26 http://www.yahoo.com/ Tak Nie Tak Tak Tak 27 http://www.yahoo.com/ Nie Nie Tak Tak Tak 28 http://www.google.pl/ Nie Nie Tak Tak Tak 29 http://www.google.pl/ Nie Tak Tak Tak Tak 30 http://www.yahoo.com/ Nie Tak Tak Tak Tak 31 http://www.yahoo.com/ Tak Tak Tak Tak Tak 32 http://www.google.pl/ Tak Tak Tak Tak Tak 33 http://www.rp.pl/ Tak Tak Tak Tak Tak 34 http://www.gazetaprawna.pl/ Tak Tak Tak Tak Tak 35 http://www.gazetaprawna.pl/ Nie Tak Tak Tak Tak 36 http://www.rp.pl/ Nie Tak Tak Tak Tak 37 http://www.rp.pl/ Nie Nie Tak Tak Tak 38 http://www.gazetaprawna.pl/ Nie Nie Tak Tak Tak 39 http://www.gazetaprawna.pl/ Tak Nie Tak Tak Tak 40 http://www.rp.pl/ Tak Nie Tak Tak Tak 41 http://www.rp.pl/ Tak Nie Nie Tak Tak 42 http://www.gazetaprawna.pl/ Tak Nie Nie Tak Tak 43 http://www.gazetaprawna.pl/ Nie Nie Nie Tak Tak 44 http://www.rp.pl/ Nie Nie Nie Tak Tak 45 http://www.rp.pl/ Nie Tak Nie Tak Tak 46 http://www.gazetaprawna.pl/ Nie Tak Nie Tak Tak 47 http://www.gazetaprawna.pl/ Tak Tak Nie Tak Tak 48 http://www.rp.pl/ Tak Tak Nie Tak Tak 49 http://www.rp.pl/ Tak Tak Nie Tak Tak 50 http://www.gazetaprawna.pl/ Tak Tak Nie Tak Tak 51 http://www.gazetaprawna.pl/ Nie Tak Nie Tak Tak 52 http://www.rp.pl/ Nie Tak Nie Tak Tak 53 http://www.rp.pl/ Nie Nie Nie Tak Tak 54 http://www.gazetaprawna.pl/ Nie Nie Nie Tak Tak 55 http://www.gazetaprawna.pl/ Tak Nie Nie Tak Tak 56 http://www.rp.pl/ Tak Nie Nie Tak Tak 57 http://www.rp.pl/ Tak Nie Tak Tak Tak 58 http://www.gazetaprawna.pl/ Tak Nie Tak Tak Tak 59 http://www.gazetaprawna.pl/ Nie Nie Tak Tak Tak 60 http://www.rp.pl/ Nie Nie Tak Tak Tak 61 http://www.rp.pl/ Nie Tak Tak Tak Tak 62 http://www.gazetaprawna.pl/ Nie Tak Tak Tak Tak 63 http://www.gazetaprawna.pl/ Tak Tak Tak Tak Tak 64 http://www.rp.pl/ Tak Tak Tak Tak Tak

b). Właściwości obiektów window, frames, history, location, navigator, screen, document Zadanie Opracować aplikacje, w której stworzyć dwie pionowych paneli (ramki). W lewej paneli (ramce) rozmieścić przycisku "Window", Ramki, Historia, URL, Przeglądarka, Ekran i Dokument. W prawej paneli (ramce) po naciśnięciu przycisku "Window", Ramki, Historia, URL, Przeglądarka, Ekran lub Dokument wyświetlać odpowiednio wszystkie właściwości i metody obiektów window, frames, history, location, navigator, screen lub document modelu BOM. Dla obiektu location wyświetlić URL za pomocą metody "tostring()". Opracowanie zadań <skrypt> <pliki JS i CSS> Testowanie <zrzut z przeglądarki> Pokazać prowadzącemu wyniki pracy. Sprawozdanie Na każdym zajęciu laboratoryjnym sporządza się za pomocą edytora Word sprawozdanie na bazie materiałów ćwiczenia. Bazowa zawartość sprawozdania musi być przygotowana w domu przed ćwiczeniem (sprawozdanie do ćwiczenia pierwszego jest przygotowywane w czasie ćwiczenia). W czasie ćwiczenia do sprawozdania są dodawane wyniki testowania. Treść sprawozdania: strona tytułowa, spis treści sporządzony za pomocą Word'a, dla każdego punktu rozdziały "Zadanie ", "Opracowanie zadania" (rozdział ze skryptem i komentarzami), "Testowanie" (rozdział z opisem danych wejściowych i wynikami testowania, w tym zrzuty okna przeglądarki). Wzorzec strony tytułowej znajduje się w pliku Strona_tytulowa_stac_Interpr_jezyki_progr_PWSBAiTK.doc. Nazwa pliku ze sprawozdaniem musi zawierać skrót "InterprJP_52_", numer ćwiczenia i nazwisko studenta (bez polskich liter, żeby można było archiwizować). Pliki ze sprawozdaniem są przekazywane do archiwum grupy.

Wskazówki Reakcja na naciśnięcie przycisku W następnym programie jest zaimplementowana reakcja na naciśnięcie przycisku oraz wyświetlenie modalnego okna: <html> <head> function func2() { window.alert('reakcja na button'); } <input type="button" id="bid" name="b1" value="start" onclick="func2()"> </body> </html> Otwieranie i zamykanie okien metodami obiektu window Metoda open( _adres_url, _nazwa_okna, _atrybuty_przez_przecinek ) otwiera okno, a metoda close() zamyka okno. Przykład: window.open ( http://www.google.pl/, wingoogle, width=400,height=250, top=50,left=50,resizeable=yes ) Jeżeli skrypt dotyczy głównego okna, to można nie wskazywać na obiekt window : open( http://www.google.pl/, wingoogle, width=400,height=250,top=50, left=50,resizeable=yes ) W trzecim argumencie są zapisywane atrybuty okna. Uwaga. W ciągu atrybutów nie można stosować spacje. Przeglądarka Firefox nie obsługuje poprawnie "resizeable=no". Atrybuty okna: Atrybut Wartość left, top, width, height Liczba Współrzędna od lewej, od góry oraz szerokość i wysokość okna resizable yes / no* Określa możliwość zmiany rozmiaru okna przez przeciągnięcie ramki scrollbars yes / no* Określa możliwość przewijania okna location yes / no* Określa, czy musi być pasek adresu toolbar yes / no* Określa, czy musi być pasek narzędzi status yes / no* Określa, czy musi być pasek stanu * - wartość domyślna

Przykład: <html><head> <meta http-equiv="content-type" content="text/html; charset=windows-1250" /> <title>strona</title> var newwind=window.open("http://www.google.pl/", "oknogoogle", "width=600,height=450,top=50,left=50,resizeable=yes"); newwind.moveto(0,300) ; <p>tekst testowy</p> window.resizeto(800,600); window.moveto(100,100) ; </body></html> Wyświetlenie listy właściwości i metod obiektu W następnym programie zaimplementowano wyświetlenie listy właściwości i metod obiektu "window" JavaScript: <html><head> <title>okno</title> var indeks; for (indeks in window) { document.write(indeks+" = "+window[indeks] + "<br />"); } </body></html> Tworzenie paneli ramek W następnym programie jest zaimplementowane tworzenie ramek: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/tr/html4/dtd/frameset.dtd"> <html><head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-2"> <title>właściwości</title> <frameset cols="50%,*"> <frame src="frame1.htm" id="id1" name="fr1"> <frame src="frame2.htm" id="id2" name="fr2"> </frameset> </html>

Aby odwołać się do jednego z obiektów kolekcji frames należy zastosować indeks ramki. Przykład z wyświetleniem tekstu w ramce 2: <!-- plik frames.htm --> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/tr/html4/dtd/frameset.dtd"> <html><head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-2"> <title>strona testowa</title> function tekst2() { parent.frames[1].document.open(); parent.frames[1].document.write("w oknie 1 był naciśnięty przycisk.<br />"); var nram=window.frames.length parent.frames[1].document.write("ilość ramek = "); parent.frames[1].document.write(nram); parent.frames[1].document.close(); } <frameset rows="50%,*"> <frame src="frame1.html" id="id1" name="fr1"> <frame src="frame2.html" id="id2" name="fr2"> </frameset> </html> <!-- plik frame1.html --> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/tr/html4/dtd/frameset.dtd"> <html><head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-2"> <p>ramka 1</p> <input type="button" id="but1" name="but1" value="start" onclick="parent.tekst2()"> </body></html> <!-- plik frame2.html --> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/tr/html4/dtd/frameset.dtd"> <html><head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-2"> <p>ramka 2</p> </body></html>

Model BOM Model BOM opisuje obiekty umożliwiające manipulowanie oknem przeglądarki. Współdziałanie przeglądarki i skryptów w pliku HTML (lub XHTML), oraz współdziałanie przeglądarki i ekranu ilustruje niżej położony rysunek. Plik HTML (lub XHTML) Przeglądarka Pliki CSS i JS Obiekty BOM Obiekty DOM Ekran Skrypty JavaScript używają właściwości przeglądarki, a przeglądarka może zmieniać zawartość plików HTML (XHTML), CSS i JS. Dostępne do wykorzystania właściwości przeglądarki są opisywane, jako modeli BOM (Browser Object Model) i DOM (Document Object Model). Obiekty skoncentrowane w modelu BOM sterują oknem przeglądarki, a obiekty modelu DOM dokumentem. Model BOM (Browser Object Model) porządkuje komponenty przeglądarki, które odpowiadają za dostęp do okna wyświetlanym na ekranie i manipulowanie tym oknem. Nie istnieje standard opisujący model BOM, ale w każdej przeglądarce można wydzielić komponenty modelu BOM. Skrypty JavaScript mają dostęp do obiektów BOM i przez nich manipulują oknem przeglądarki. Manipulowanie oknem przeglądarki Bazowym obiektem modelu BOM jest obiekt window. Obiekt window Właściwości obiektu window Właściwość status defaultstatus Wyświetlany tekst Tekst, który jest wyświetlany na czas oglądania strony Pasek stanu Pasek stanu znajduje się w dolnej części okna. Do definiowania zawartości pasku stanu obiektu window są stosowane dwie właściwości: status = _tekst_na_krótko wyświetlany tekst, defaultstatus = _tekst_na_stałe tekst jest wyświetlany na czas oglądania strony. Przykład: window.defaultstatus="gotowe";

Metody obiektu window Metoda moveby(dx, dy) Przemieszcza okno o dx pikseli w poziomie i o dy pikseli w pionie moveto(x, y) Ustawia lewy górny róg okna w punkcie (x, y), gdzie x i y są liczone w pikselach resizeby(dw, dh) Zmienia rozmiar okna o dw pikseli w poziomie i o dh pikseli w pionie resizeto(w, h) Ustawia rozmiar okna na szerokość w i wysokość h, gdzie w i h są liczone w pikselach open( _adres_url, Otwieranie okna _nazwa_okna, _atrybuty_przez_przecinek ) close() Zamykanie okna alert(_informujący_ciąg_znaków) Tworzy modalne okno dialogowe z przyciskiem OK i wyświetla tekst _Informujący_ciąg_znaków confirm(_ciag_znaków_zapytania) Tworzy modalne okno dialogowe z dwoma przyciskami OK i Anuluj oraz wyświetla tekst _Ciąg_znaków_zapytania prompt(_zapytanie, Tworzy modalne okno dialogowe z polem edycyjnym i dwoma przyciskami OK i Anuluj oraz wyświe- _Odpowiedź_domyślna) tla tekst _Zapytanie settimeout(_funkcja, _odstęp) Do odliczenia odstępów czasowych cleartimeout(_identyfikator_ Do rezygnacji z odliczenia odstępów czasowych zwrócony_settimeout) setinterval(_funkcja, _odstęp) Do nieskończonego powtórzenia odstępów czaso- clearinterval(_identyfikator_ zwrócony_setinterval) wych Do rezygnacji z nieskończonego powtórzenia odstępów czasowych Metody obiektu window do manipulowania oknem przeglądarki: moveby(dx, dy) przemieszcza okno o dx pikseli w poziomie i o dy pikseli w pionie, moveto(x, y) ustawia lewy górny róg okna w punkcie (x, y), gdzie x i y są liczone w pikselach, resizeby(dw, dh) zmienia rozmiar okna o dw pikseli w poziomie i o dh pikseli w pionie, resizeto(w, h) ustawia rozmiar okna na szerokość w i wysokość h, gdzie w i h są liczone w pikselach. Metody obiektu window do otwierania i zamykania okien: open( _adres_url, _nazwa_okna, _atrybuty_przez_przecinek ) - otwieranie okna, close() - zamykanie okna. Przykład: window.open ( http://www.google.pl/, wingoogle, width=400,height=250, top=50,left=50,resizeable=yes ) Jeżeli skrypt dotyczy głównego okna, to można nie wskazywać na obiekt window :

open( http://www.google.pl/, wingoogle, width=400,height=250,top=50, left=50,resizeable=yes ) W trzecim argumencie są zapisywane atrybuty okna. Uwaga. W ciągu atrybutów nie można stosować spacje. Atrybuty okna: Atrybut Wartość left, top, width, height Liczba Współrzędna od lewej, od góry oraz szerokość i wysokość okna resizable yes / no* Określa możliwość zmiany rozmiaru okna przez przeciągnięcie ramki scrollbars yes / no* Określa możliwość przewijania okna location yes / no* Określa, czy musi być pasek adresu toolbar yes / no* Określa, czy musi być pasek narzędzi status yes / no* Określa, czy musi być pasek stanu * - wartość domyślna Obiekt window zawiera trzy metody do otwierania systemowych modalnych okien dialogowych: alert(_informujący_ciąg_znaków) tworzy modalne okno dialogowe z przyciskiem OK i wyświetla tekst _Informujący_ciąg_znaków, Przykład: <html> <head> <meta http-equiv="content-type" content="text/html; charset=windows- 1250"> <title>strona</title> <p>teksty JavaScript</p> window.alert("test"); </body> </html>

confirm(_ciag_znaków_zapytania) tworzy modalne okno dialogowe z dwoma przyciskami OK i Anuluj oraz wyświetla tekst _Ciąg_znaków_zapytania. Funkcja zwraca wartość true, jeśli było naciśnięte OK, oraz wartość false, jeśli było naciśnięte Anuluj. Przykład: <html> <head> <meta http-equiv="content-type" content="text/html; charset=windows- 1250"> <title>strona</title> <p>teksty JavaScript</p> var odpowiedz=window.confirm("czy wykonać test?"); document.write(odpowiedz); </body> </html> prompt(_zapytanie, _Odpowiedź_domyślna) tworzy modalne okno dialogowe z polem edycyjnym i dwoma przyciskami OK i Anuluj oraz wyświetla tekst _Zapytanie. Do pola edycyjnego jest wpisywany tekst _Odpowiedź_domyślna. Funkcja zwraca wartość pola edycyjnego, jeśli było naciśnięte OK. W przypadku naciśnięcia przycisku Anuluj funkcja zwraca wartość null. Przykład: <html> <head> <meta http-equiv="content-type" content="text/html; charset=windows- 1250"> <title>strona</title> <p>teksty JavaScript</p> var odpowiedz=window.prompt("który test wykonać?", "Wiraż"); document.write(odpowiedz); </body> </html>

Czasomierz okna Obiekt window ma metodę settimeout do odliczenia odstępów czasowych. Metoda settimeout ma dwa argumenty, z których pierwszy jest skryptowym odwołaniem do funkcji, która będzie wywołana po upływie odstępu czasowego wprowadzonego w drugim argumencie w milisekundach. Przykład: <html><head> <meta http-equiv="content-type" content="text/html; charset=windows-1250"> <title>strona</title> function funk(){alert("opóźnienie 4 s");} settimeout(funk,4000); </body></html> Do rezygnacji z odliczenia odstępów czasowych służy metoda cleartimeout (_identyfikator_zwrócony_metodą_settimeout). Dwie metody setinterval i clearinterval podobne do metod settimeout i cleartimeout służą do nieskończonego powtórzenia odstępów czasowych. Przykład zawierający realizację zegara na pasku stanu. <html><head> <meta http-equiv="content-type" content="text/html; charset=windows-1250" /> <title>strona</title> ///window.defaultstatus="gotowe"; function zegar() { var czas=new Date(); var g=czas.gethours(); var m=czas.getminutes(); var s=czas.getseconds(); window.status=g+((m<10)?":0":":")+m+((s<10)?":0":":")+s; } setinterval("zegar()",1000); </body></html>

Zdarzenia obiektu window Zdarzenie Właściwość Sytuacja abort onabort Anulowanie pobierania strony blur onblur Okno traci fokus (aktywność) change onchange Zmiana wartości w graficznych elementach okna click onclick Kliknięcie myszą close onclose Zamknięcie okna dragdrop ondragdrop Zdarzenie "przeciągnij i upuść w oknie" error onerror Wykrycie błędu przez przeglądarkę focus onfocus Kontrolka została uaktywniona keydown onkeydown Naciśnięcie przycisku na klawiaturze keypress onkeypress Naciśnięcie przycisku na klawiaturze i zwolnienie przycisku keyup onkeyup Zwolnienie przycisku na klawiaturze load onload Ładowanie dokumentu mousedown onmousedown Naciśnięcie przycisku myszy mousemove onmousemove Kursor myszy przesunął się mouseout onmouseout Kursor myszy wyszedł poza obiekt graficzny mouseover onmouseover Kursor myszy przesuwa się nad obiektem graficznym mouseup onmouseup Zwolnienie przycisku myszy paint onpaint Rysowanie w oknie reset onreset Zerowanie danych resize onresize Zmiana przez użytkownika rozmiaru okna scroll onscroll Przewijanie okna select onselect Zaznaczenie tekstu submit onsubmit Wysyłanie danych formularzu unload onunload Wyładowanie dokumentu Przykład zawierający reakcje na ładowanie strony: <html> <head> function func() { window.alert('zakończono ładowanie strony'); } window.onload = func; </body> </html>

Obiekty window Obiekt window zawiera następujące obiekty i kolekcji obiektów: Obiekty i kolekcji obiektów frames history location navigator screen document Kolekcja ramek okna, z których każda jest obiektem window Lista stron, które odwiedzał użytkownik Obiekt reprezentujący adres URL (Uniform Resource Locator) Obiekt zawierający informację o przeglądarce Obiekt zawierający informację o monitorze Obiekt zawierający właściwości dokumentu Obiekt frames Obiekt frames jest kolekcją ramek okna, z których każda jest obiektem window. Ilość obiektów można otrzymać przez właściwość length : var ilo=window.frames.length Obiekt history Obiekt history jest listą stron, które wcześniej odwiedził użytkownik. Obiekt history ma metody: Metoda back() Do przejścia w liście wstecz forward() go(_ilość) Do przejścia w liście do przodu Do przejścia w liście wstecz lub do przodu na odległość wskazaną w argumencie _ilość Właściwość length daje możliwość sprawdzić, ile adresów URL znajduje się w liście. var ilo=window.history.length Obiekt history nie udostępnia adresy URL.

Obiekt location Obiekt location reprezentuje adres URL załadowanej strony. Obiekt location ma następujące właściwości. Właściwość href Pełny adres URL. Właściwość może być ustawiona host Nazwa serwera hostname Nazwa serwera bez prefiksu www protocol Nazwa protokołu, który znajduje się w adresie URL przed znakami // pathname Wszystko, co następuje w adresie URL po nazwie serwera search Ciąg zapytania, który może znajdować się w adresie URL po znaku? hash Wszystko, co następuje w adresie URL po znaku # port Numer portu umieszczony w adresie URL Właściwość href umożliwia ustawienie adresu URL: location.href= http://www.pwsbia.edu.pl/ Metody obiektu location : Metoda assign(_adres_url) Ustawienie adresu URL replace(_adres_url) Ustawienie adresu URL oraz usuwania aktualnego adresu z listy historii reload(_znacznik_źródła) Ładowanie ponownie aktualnej strony z serwera, jeśli _znacznik_źródła jest równy true, lub z bufora, jeśli _znacznik_źródła jest równy false tostring() Zwraca pełny adres URL Obiekt navigator Obiekt navigator zawiera informację o przeglądarce. Ilość właściwości tego obiektu różni się w zależności od przeglądarki. Dlatego na bazie zbioru właściwości można ustalić typ przeglądarki.

Obiekt navigator przeglądarki Internet Explorer ma właściwości: Właściwość appcodename appname appversion appminorversion browserlanguage systemlanguage userlanguage cpuclass platform plugins cookieenabled online useragent userprofile Nazwa kodowa przeglądarki Oficjalna nazwa przeglądarki Wersja przeglądarki Dodatkowa informacja o wersji przeglądarki Język przeglądarki Język systemu operacyjnego Język użytkownika przeglądarki Klasa procesora Platforma programowa zastosowana w komputerze Lista bibliotek-wtyczek komputera Znacznik włączenia obsługi cookies Znacznik podłączenia do Internetu Nagłówek User-Agent Profil użytkownika przeglądarki Obiekt navigator przeglądarki Internet Explorer ma metody: Metoda javaenabled() taintenabled() Zwraca znacznik włączenia obsługi Javy Zwraca znacznik zezwolenia na przekazywanie zabezpieczonych danych Obiekt navigator przeglądarki Firefox Mozilla ma właściwości: Właściwość appcodename appname appversion cookieenabled language mimetypes oscpu platform plugins product productsub securitypolicy useragent vendor vendorsub Nazwa kodowa przeglądarki Oficjalna nazwa przeglądarki Wersja przeglądarki Znacznik włączenia obsługi cookies Język przeglądarki Tablica typów MIME System operacyjny lub procesor Platforma programowa zastosowana w komputerze Lista bibliotek-wtyczek komputera Nazwa produktu Dodatkowe informacje o produkcie Podsystem ochrony danych Nagłówek User-Agent Typ przeglądarki Dodatkowe informacje o typie przeglądarki

Obiekt navigator przeglądarki Firefox Mozilla ma metody: Metoda javaenabled() preference() taintenabled() Zwraca znacznik włączenia obsługi Javy Ustawia preferencje przeglądarki Zwraca znacznik zezwolenia na przekazywanie zabezpieczonych danych Obiekt screen Obiekt screen zawiera informację o ekranie i ma następujące właściwości: Właściwość height, width availheight, availwidth colordepth Wysokość i szerokość ekranu w pikselach Wysokość i szerokość ekranu w pikselach, które są dostępne dla okien Ilość bitów palety kolorów Wartość właściwości colordepth jest zwykle równa 32 (4 * 8). Obiekt document Obiekt document występuje w obydwóch modelach: BOM i DOM. Każda z tych modeli dołącza do obiektu swój podzbiór właściwości i metod. Obiekt document jako podobiekt obiektu window ma następujące właściwości. Właściwość alinkcolor Kolor aktywnego odnośnika zdefiniowany poprzez <body alink="kolor"> linkcolor Kolor odnośników zdefiniowany poprzez <body link="kolor"> vlinkcolor Kolor odwiedzonych odnośników zdefiniowany poprzez <body vlink="kolor"> bgcolor Kolor tła zdefiniowany poprzez <body bgcolor="kolor"> fgcolor Kolor tekstu zdefiniowany poprzez <body text="kolor"> lastmodified Data ostatniej modyfikacji strony referrer Adres URL umieszczony w historii przeglądarki o jedną pozycję wcześniej URL Adres URL aktualnej strony. Właściwość może być ustawiona title Tytuł strony wyświetlany w znaczniku <title/>. Właściwość może być ustawiona W modelu BOM obiekt document składa się z szeregu kolekcji: Kolekcja anchors applets embeds forms images links Kolekcja kotwic dokumentu (konstrukcje <a name= _nazwa_kotwicy"></a>) Kolekcja apletów dokumentu Kolekcja obiektów osadzonych w dokumencie Kolekcja formularzy na stronie Kolekcja obrazów dokumentu Kolekcja odnośników (łącz) (konstrukcje typu <a href= _adres_url"></a>)

Ilość obiektów każdej kolekcji można otrzymać przez właściwość length, na przykład: var ilo=windows.images.length Aby wywołać jeden z obiektów należy zastosować indeks obiektu, na przykład: var img=windows.document.images[0] lub krócej var img=document.images[0] Można też odwołać się do jednego z obiektów poprzez nazwę obiektu, na przykład: var img=windows.document.images[ _nazwa_obrazu ] lub krócej var img=document.images[ _nazwa_obrazu ] Metody obiektu document w modelu BOM: Metoda open() close() write(_argument) writeln(_argument) Otwarcie dokumentu w celu zapisywania do niego Zamkniecie dokumentu otwartego metodą open(), co powoduje wyświetlenie dokumentu Wyświetlenie argumentu _argument w miejscu wywołania metody Wyświetlenie argumentu _argument w miejscu wywołania metody oraz przejście na nowy wiersz