Obiekty DOM w JavaScript Flashcards
Co to obiekt DOM?
DOM to sposób reprezentacji złożonych dokumentów XML oraz XHTML w postaci modelu obiektowego
Co to obiekty “window”?
obiekt window – opisuje bieżące okno przeglądarki. Jest najważniejszym obiektem w hierarchii, dlatego odwołanie do jego właściwości lub metod nie wymaga podania nazwy obiektu. Tworzony jest automatycznie podczas otwierania okna przeglądarki.
Właściwości obiektu window
closed // informuje czy okno jest zamknięte
self // bieżące okno
top // okno najwyższego rzędu
status // komunikat w pasku stanu okna przeglądarki
defaultStatus // komunikat gdy oczekuje się na wprowadzenie danych
name // identyfikator okna otwartego metodą window.open()
innerHeight; // wysokość okna przeglądarki
innerWidth; // szerokość okna przeglądarki
Metody obiektu window
open() // otwieranie nowego okna
np.: window.open(‘http://wp.pl’,’Wirtualna Polska’);
close() // zamykanie okna
confirm() // okno decyzyjne
alert() // okno dialogowe
prompt() // okno tekstowe (wprowadzanie danych)
Co to obiekt navigator?
navigator – pozwala na dostęp do informacji dotyczących przeglądarki. Służy do ustalenia wersji przeglądarki używanej przez użytkownika. Właściwości tego obiektu mogą być tylko odczytywane.
Właściwości obiektu navigator
appName // zawiera nazwę przeglądarki
appVersion // zawiera numer wersji przeglądarki
language // kod języka przeglądarki
online // określa czy przeglądarka pracuje w trybie online
oscpu // określa system operacyjny na którym uruchomiona jest przeglądarka
Metoda obiektu navigator
javaEnabled() // zwraca wartość prawda, jeśli dana przeglądarka obsługuje Javę lub fałsz jeśli nie
Co to obiekt document?
document – zawiera informacje o bieżącym dokumencie HTML. Poprzez jego właściwości mamy wpływ na elementy strony (np. kolor tła, kolor czcionki). Jego metody umożliwiają wyświetlenie np. tekstu w oknie przeglądarki.
Właściwości obiektu document
document.URL // zwraca adres dokumentu
document.title // zwraca tytuł strony
document.location // pobiera URL bieżącego dokumentu
document.lastModified // data ostatniej modyfikacji strony
document.referrer // zwraca URL strony, która przekierowała na
bieżącą stronę
document.bgColor // określa kolor tła dok., ustawianego atrybutem
bg-color
document.fgColor // określa kolor pierwszego planu dok.,
ustawianego atrybutem text
**document.linkColor **// określa kolor łącza w dok. ustawianego
atrybutem link
document.alinkColor // określa kolor łącza w dok. ustawianego
atrybutem alink
document.vlinkColor // określa kolor łącza w dok. ustawianego
atrybutem vlink
**document.cookie ** // ustawia lub odczytuje cookie dla dokumentu
document.forms.length // ilość formularzy
document.links.length // ilość linków
document.anchors.length // ilość zakotwiczeń
Metody obiektu document
document.getElementById(“tekst1”) // łączy kod HTML z JavaScript
document.getElementsByTagName(p) // odwołanie do kolekcji akapitów
document.getElementsByTagName(p)[0]
write() // wyświetla tekst na ekranie
writeln() // wyświetla tekst na ekranie i przechodzi do kolejnej linii
clear() // czyści zawartość bieżącego okna
close() // zamyka bieżące okno
Co to obiekt location?
location – zawiera informacje o bieżącym adresie URL. Jego właściwości odpowiadają kolejnym członom adresu. Ogólna postać lokalizatora URL to: protocol://host:port/path#fragment?query
Właściwości obiektu location
location.href // zawiera cały adres URL
location.protocol // zawiera protokół
location.hostname // zawiera nazwę hosta
location.port // zawiera numer portu
location.pathname // zawiera nazwę pliku ze ścieżką
location.search // zawiera zapytanie jeśli znajduje się w adresie
location.hash // zawiera nazwę kotwicy
Metody obiektu location
location.reload() // odświeża bieżący dokument
location.replace() // zastępuje bieżący adres URL nowym
location.assign() // wczytuje dokument o adresie wskazanym przez url
Co to obiekt history?
history – zawiera historię stron odwiedzanych w bieżącej sesji
Właściwości obiektu history
history.length // długość listy historii
history.current // zawiera bieżący lokalizator
Metody obiektu history
history.go() // otwiera określony adres z listy historii
history.back() // otwiera poprzedni adres z listy historii
history.forward() // otwiera następny adres z listy historii
Co to obiekt link?
link – zawiera informację o łączu do określonego adresu. Obiekty link są zapisane w tablicy links. W dokumencie może wystąpić wiele obiektów link. Każdy z nich jest zapisany jako oddzielny element tablicy.
Właściwość obiektu link
document.links.length //określa liczbę linków na stronie
var link1=links[0].href
Co to obiekt anchor?
anchor – reprezentuje kotwicę w bieżącym dokumencie. Podobnie jak łącza, kotwice są zapisywane w tablicy o nazwie anchors. Każdy jej element jest obiektem anchor.
Właściwość obiektu anchor
document.anchors.length // określa liczbę elementów kotwicy
Co to obiekt form?
zawiera informacje dotyczące formularzy występujących w dokumencie HTML. Obiekty form są zapisane w tablicy forms. Każdy formularz jest zapisany jako oddzielny element tablicy. Do wybranego formularza można odwoływać się przez indeks lub przez nazwę. Inną metodą odwołania do formularza jest wykorzystanie metody getElementById().
Odwoływanie się do elementów formularza
Elementy formularza tworzą tablicę. Dostęp do nich jest możliwy przez odwołanie się do kolejnych elementów tej tablicy (elements[i]). Podobnie jak do całego formularza, do jego elementów można odwoływać się przez indeks lub przez nazwę:
document.forms[‘form1’].elements[0]
document.forms[‘form1’].elements[‘nazwa’]
document.forms[‘form1’].nazwa
lub za pomocą metody getElementById():
document.getElementById[‘imie’].value;
