2. HTML, DOM i XHTML - cel i charakterystyka

Transkrypt

2. HTML, DOM i XHTML - cel i charakterystyka
2. HTML, DOM i XHTML - cel i charakterystyka
HTML
(ang. HyperText Markup Language) – dominujący język wykorzystywany do
tworzenia stron internetowych. Pozwala opisać strukturę informacji zawartych w dokumencie
nadając znaczenie poszczególnym fragmentom tekstu oraz osadzić w tekście dodatkowe obiekty np.
statyczne grafiki, interaktywne formularze, dynamiczne animacje. W składni języka HTML
wykorzystuje się znaczniki opatrzone z obu stron nawiasami ostrokątnymi.
Komponenty języka HTML.
Głównymi komponentami języka HTML są:
–
znaczniki (i ich atrybuty)
–
typy danych
–
referencje znakowe
–
odwołania w postaci encji
–
deklaracja typu dokumentu
Znaczniczki - są podstawowymi komponentami języka HTML. Charakteryzują je dwie cechy:
atrybuty i zawartość. Każdy atrybut i zawartość musi spełniać określone wymagania, aby dokument
został poprawnie zwalidowany pod kątem zgodności ze standardem. Znacznik zwykle rozpoczyna
się znacznikiem otwierającym (np. <znacznik>), a kończy znacznikiem zamykającym
(np. </znacznik>). Atrybuty elementu są zawarte w znaczniku otwierającym (po nazwie
znacznika), natomiast zawartość umieszczana jest pomiędzy znacznikiem otwierającym i
zamykającym. (np. <znacznik
atrybut="wartość">zawartość</znacznik>).
Niektóre elementy, np. <br>, nie posiadają zawartości, a także znacznika zamykającego.
Typy danych - HTML definiuje kilka typów danych, wprowadzanych jako wartości elementów lub
atrybutów. Są to m.in. skrypty (script data), dane arkuszy stylów (stylesheet data), identyfikatory,
nazwy, adresy URI, liczby, jednostki miary długości, języki, deskryptory mediów, kolory,
kodowania znaków, data i czas, itp.
Encje i referencje znakowe – HTML (od wersji 4.0) definiuje listę 252 encji i 1114050 symboli
znakowych pozwalających na zapisanie określonych znaków za pomocą specjalnych stałych,
np.: znak „<” możemy zapisać jako &lt; natomiast znak „&” (ampersand) jako &amp;
Deklaracja typu dokumentu (DTD) - aby ją uaktywnić do celów poprawnej walidacji utworzonej
strony, dokument powinien rozpoczynać się deklaracją typu dokumentu (nieformalnie DOCTYPE).
Deklaracja ta umożliwia także uniknięcie działania przeglądarek w trybie, który zakłada
wykorzystywanie przestarzałych konstrukcji językowych niezgodnych ze standardami W3C i IETF
(tzw. Quirks mode – tryb osobliwości).
np.: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
XHTML
(ang. Extensible HyperText Markup Language, rozszerzalny język znaczników
hipertekstowych) – język służący do tworzenia stron WWW ogólnego przeznaczenia. Specyfikacje
XHTML przygotowuje organizacja W3C.
XHTML nie jest następcą HTML a jedynie przedstawieniem HTML 4.01 w postaci XML. W
odróżnieniu od HTML (który jest aplikacją SGML), dokumenty pisane w XHTML są zgodne z
oficjalną specyfikacją XML (oznacza to tyle, że dokumenty XHTML są poprawnymi dokumentami
XMLowymi). Dzięki temu można je łatwo generować z innych dokumentów XML przy pomocy
np. transformacji XSLT. Kolejną cechą jest możliwość łączenia z innymi językami zgodnymi z
XML, np. MathML (umożliwiający zagnieżdżanie wzorów matematycznych) czy SVG
(umieszczanie grafik wektorowych).
Podstawowe reguły XHTML.
Poniżej przedstawione zostały podstawowe zasady konstruowania dokumentów XHTML
(najważniejsze różnice w porównaniu z HTML):
–
jeśli strona XHTML zawiera błędy, nie może zostać wyświetlona
–
strony XHTML muszą mieć typ zawartości application/xhtml+xml (lub inny XML)
–
dzięki użyciu XHTML można stosować inne aplikacje XML (jak MathML czy SVG)
bezpośrednio w dokumencie, czego nie da się w HTML
–
element główny (html) musi zawierać atrybut xmlns określający przestrzeń nazw XHTML:
http://www.w3.org/1999/xhtml
–
znacznikowi otwierającemu każdego niepustego elementu powinien odpowiadać znacznik
zamykający (np. <li> ... </li>)
–
puste elementy muszą także być zamykane (np. zamiast <br> musi być <br/>, albo
<br></br>)
–
nazwy elementów i atrybutów XHTML muszą być pisane małymi literami
–
wszystkie wartości atrybutów muszą być ujęte w cudzysłów (podwójny, np. <td
rowspan="3"> albo apostrof, np. <td rowspan='3'>)
DOM (Document Object Model) – Obiektowy model
dokumentu.
Obiektowy model dokumentu jest to, niezależny od platformy i języka programowania,
sposób reprezentacji złożonych dokumentów XML i HTML w postaci modelu obiektowego.
Standard W3C DOM definiuje zespół klas i interfejsów, pozwalających na dostęp do struktury
dokumentów oraz jej modyfikację poprzez tworzenie, usuwanie i modyfikację tzw. węzłów (ang.
nodes).
Dla większości języków programowania istnieją biblioteki obsługujące DOM dla plików XML.
Najbardziej zaawansowane z nich to Apache Xerces i MS XML. Standard W3C definiuje interfejsy
DOM tylko dla języków JavaScript i Java.
Bazową częścią specyfikacji DOM jest tzw. „DOM Core”, wg której dokument jest
drzewem zawierającym węzły (nodes). Węzeł jest najbardziej podstawowym interfejsem w DOM.
Każdy węzeł może być elementem, fragmentem tekstu, komentarzem, instrukcją preprocesora (np.
dołączonym fragmentem PHP) albo encją. Większość węzłów może posiadać węzły potomne.
Interfejs ten definiuje metody pozwalające na dodawanie, usuwanie i przemieszczanie (np. zmianę
kolejności) węzłów potomnych.
DOM Core umożliwia:
●
budowanie dokumentów,
●
nawigację po strukturze dokumentów,
●
dodawanie elementów i atrybutów,
●
modyfikacje elementów i atrybutów,
●
usuwanie elementów/atrybutów i ich zawartości
Jego wadami są: pamięciożerność, niska efektywność, skomplikowany model dostępu do węzłów.
Drugą częścią DOM W3C jest typowy dla przeglądarek DOM HTML. Jest to zestaw metod
ułatwiających tworzenie dynamicznych stron oraz zapewniających kompatybilność wstecz z
wcześniejszym prostym DOM Netscape. DOM HTML przedstawia dokument jako kilka kolekcji
obiektów określonych typów (np. formularze, obrazki) oraz dodaje pola/metody ułatwiające dostęp
do funkcjonalności specyficznej dla HTML, jak np. odczyt pól formularza.
Głównym, globalnym obiektem w DOM przeglądarki jest window. W tym obiekcie
przechowywane są wszystkie globalne zmienne i funkcje. W nim znajduje się także obiekt
document, który preprezentuje całą stronę (X)HTML.
Poniżej schemat, przedstawiający hierarchię obiektów w przykładowym DOM HTML (źródło:
wikipedia.org):
Rysunek 1: Hierarchia obiektów w przykładowym
DOM HTML.
Źródła:
[1] http://pl.wikipedia.org/wiki/HTML
[2] http://pl.wikipedia.org/wiki/XHTML
Powyższe hasła są dosyć dobrze opracowane, dlatego polecam w wolnej chwili je również
przejrzeć, choć najważniejsze informacje starałem się zawrzeć w powyższym opracowaniu.
Ponadto:
[3] wykład dra Tomasza Walkowiaka (wykład nr 2 - DOM)
[4] http://en.wikipedia.org/wiki/Document_Object_Model
[5] http://kurs.browsehappy.pl/JavaScript/DOM