Zawartość metadata
- Data publikacji
- Ostatnio edytowano
Do kategorii zawartość metadata należą przede wszystkim elementy HTML, które mogą reprezentować dodatkowe informacje metadata o danym dokumencie HTML, jak również elementy HTML, które mogą tworzyć relację pomiędzy danym dokumentem HTML, a innymi plikami różnego typu, jak również elementy HTML, które mogą tworzyć dodatkową funkcjonalność danego dokumentu HTML za pomocą skryptów języka programowania (na przykład języka JavaScript) lub za pomocą reguł języka CSS.
Przykład:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<link href="https://webkod.pl/files/html/reguly-01.css" rel="stylesheet">
<title>Koszyk owoców</title>
</head>
<body>
<label>
Wybierz owoc:
<select id="lista-1">
<option>arbuz</option>
<option>gruszka</option>
<option>jabłko</option>
<option>malina</option>
<option>wiśnia</option>
</select>
</label>
<button id="przycisk-1">dodaj</button>
<p id="akapit-1">Twój koszyk owoców:</p>
<script src="https://webkod.pl/files/html/skrypt-01.js"></script>
</body>
</html>Rezultat:
Twój koszyk owoców:
Nasza przykładowa struktura HTML zawiera w sobie dodatkową informację metadata dla przeglądarki internetowej o systemie kodowania znaków, który został przypuszczalnie wykorzystany przez nas do napisania zawartości danego dokumentu HTML. Wspomnianą informację w tym wypadku reprezentuje element meta, który posiada atrybut charset wraz z wartością utf-8.
Ponadto nasza przykładowa struktura HTML zawiera w sobie informację o tytule danego dokumentu HTML. Wspomnianą informację reprezentuje element title wraz ze swoją zawartością, czyli w tym wypadku ciągiem znaków Koszyk owoców.
Dzięki elementowi link, który posiada atrybut href wraz z wartością https://webkod.pl/files/html/reguly-01.css oraz atrybut rel wraz z wartością stylesheet dany dokument HTML został powiązany z zasobem internetowym w postaci pliku CSS o nazwie reguly-01. Wspomniany plik CSS o nazwie reguly-01 zawiera w swojej zawartości przykładową regułę języka CSS, dzięki której to regule języka CSS po wyświetleniu w oknie przeglądarki internetowej elementu p należącego do naszej przykładowej struktury HTML wspomniany element p będzie posiadał nowy styl wyglądu, czyli w tym wypadku niebieski kolor tła.
Dzięki elementowi script, który posiada atrybut src wraz z wartością https://webkod.pl/files/html/skrypt-01.js dany dokument HTML został powiązany z zasobem internetowym w postaci pliku JS o nazwie skrypt-01. Wspomniany plik JS o nazwie skrypt-01 zawiera w swojej zawartości przykładowy skrypt języka JavaScript, dzięki któremu to skryptowi języka JavaScript po wyświetleniu w oknie przeglądarki internetowej naszej przykładowej struktury HTML wspomniana struktura HTML będzie zawierała w sobie dodatkową funkcjonalność, za pomocą której po wybraniu nazwy interesującego nas owocu z opcji wyboru reprezentowanych przez elementy option elementu select posiadającego atrybut id o wartości lista-1, wspomniana nazwa owocu wraz z elementem b zostanie dodana do zawartości reprezentowanej przez element p posiadający atrybut id o wartości akapit-1, lecz tylko gdy klikniemy na przycisk reprezentowany przez element buttom posiadający atrybut id o wartości przycisk-1.
Kategoria zawartość metadata odgrywa ważną rolę w odniesieniu do kontekstów HTML, o których powiemy sobie wkrótce.