DHTML0143

DHTML0143



Obiektowy model dokumentu

Listing 9.1. Kiedy osoba odwiedzająca stronę kliknie na obrazku o nazwie „ bultonl ”, to zostanie w nim wyświetlony plik o nazwie „ button on.gif zamiast pliku .. button _off.gif ’

<html>

<head>

<met_a http-equiv="Content-Type"

->conr.ent ntext/html; charset=ISO-8859-2"> <title>Listing 9.1</title>

</head>

<body bgcolor="#FFFFFF">

<a href="Listing-9-l.htm" onMouseOver - "document. images .butroni. src= 'button on.gifł">

<img src="button_off.gif*' name = ,,buttonl">

</a>

</bod;/>

</html> window ->

(parent) ->

(frame) ->•

document

ID

-> image -> link a n chor -* form

Rysunek 9.1. DOM dziata poprzez wytyczenie ścieżki wiodącej począwszy od skryptu aż do pojedynczego elementu, z którym chcesz coś zrobić, znajdującego sit; wewnątrz dokumentu

HTML-owm KMify oMijest potfcbiorm

obiektu znajdującego się przed nim

Jak działa DOM?

Jeśli kiedykolwiek używałeś jakiegokolwiek języka skryptowego, to jest więcej niż pewne, że już widziałeś DOM w akcji. DOM działa poprzez opisanie ścieżki od funkcji JavaScriptu do elementu wyświetlonego w oknie przeglądarki, zazwyczaj w odpowiedzi na coś, co się zdarzyło na ekranie. (Patrz rysunek 9.1).

Ustawianie DOM

document.images.button1.src = "button_on.gif"

Powyższy kod opisuje ścieżkę rozpoczynającą się od aktualnego dokumentu i wiodącą w dół, do umieszczonych w nim obrazków, aż do źródłowego położenia obrazka o nazwie „buttonl”. Jeśli, dla przykładu, powyższy kod zostanie skojarzony z procedurą obsługi zdarzeń onMouseOver, zdefiniowaną w połączeniu otaczającym obrazek o nazwie „button I” (patrz listing 9.1), to spowoduje on zmianę wartości atrybutu SRC obrazka zjego wartości oryginalnej na „button_on.gif’.

(Patrz „Nowe procedury obsługi zdarzeń” na następnej stronie.)

Jak działa DOM?



147


Wyszukiwarka

Podobne podstrony:
DHTML0145 Obiektowy model dokumentu Obiektowy model dokumentu Tabela 9.2. Zwyczajne procedury obsług
DSCN6296 DOM (ang. Document Object Modef) - Obiektowy model dokumentw - struktura służąca reprezenta
QPrinter 2.0 instrukcja obsługi4.3.1. Otwieranie dokumentu w nowej zakładce Ekran 11 Po kliknięciu n
6III. CHARAKTERYSTYKA OBIEKTU, ANALIZA DOKUMENTACJI TECHNICZNEJ PAŃSTWOWEGO ZASOBU GEODEZYJNEGO 
145 jpeg ISBN 97IMSMU-I-W14-0.    l>> WN PWN 2007 ROZDZIAt 5 Standardowy model
IMAG0707 (3) Do czasów dwudziestowiecznej dokumentacji folklorystycznej, kiedy badacze zaotf się int
Poznaj C++ w$ godziny0071 Godzina 5Funkcje Kiedy ktoś mówi o C++ to ma na myśli przede wszystkim obi
Rys. 6. Fragment obiektowej struktury pr< Obiektowy model programu AutoCAD można porównać dr^stru
DHTML0065 Kontrola tekstu w CSS Listing 3.4. Zapisywanie kwadratu jako indeksu górnego <head>
DHTML0067 Kontrola tekstu w CSS Listing 3.6. Użycie klasy nazwisku spowoduje. : • wyrazy będą się za
DHTML0100 Marginesy i obramowania Listing 6.6. Ten kod zapisany zostanie w zewnętrznym pliku CSS o n
DHTML0135 Praktyczne zastosowanie CSS Listing 8.5. Zewnętrzny plik CSS o nazwie Listing-8-5.css, zaw
DHTML0137 Praktyczne zastosowanie CSS Listing 8.9. Określanie wyglądu trzech różnych stanów
DHTML0139 Praktyczne zastosowanie CSS Listing X. 10. W tym arkuszu stylów zdefiniowane zostały ident

więcej podobnych podstron