Книга: Выразительный JavaScript

HTML

HTML

HTML, или язык разметки гипертекста, Hypertext Markup Language – формат документа, использующийся для веб-страниц. HTML содержит текст и теги, придающие тексту структуру, описывающие такие вещи, как ссылки, параграфы и заголовки.

Простой HTML документ может выглядеть так:

<!doctype html>
<html>
  <head>
    <title>Моя домашняя страничка</title>
  </head>
  <body>
    <h1> Моя домашняя страничка </h1>
    <p>Привет, я Марейн и это моя домашняя страничка.</p>
    <p>А ещё я книжку написал! Читайте её
      <a href="http://eloquentjavascript.net">здесь</a>.</p>
  </body>
</html>

Теги, окружённые угловыми скобками < и >, описывают информацию о структуре документа. Всё остальное – просто текст.

Документ начинается с <!doctype html>, и это говорит браузеру, что его надо интерпретировать как современный HTML, в отличие от разных диалектов прошлого.

У HTML документов есть заголовок и тело. Заголовок содержит информацию о документе, а тело – сам документ. В нашем случае мы объявили, что название страницы будет «Моя домашняя страничка», затем описали документ, содержащий заголовок (<h1>, то есть heading 1, заголовок 1. Есть ещё <h2> – <h6>, заголовки разных размеров) и два параграфа.

У тегов может быть несколько форм. Элемент вроде тела, параграфа и ссылки начинается открывающим тегом <p> и заканчивается закрывающим </p>. Некоторые открывающие теги, типа ссылки <a>, содержат дополнительную информацию в виде имя=”значение”. Она называется «атрибутами». В нашем случае адрес ссылки задан как href="http://eloquentjavascript.net", где href означает «гипертекстовая ссылка», “hypertext reference”.

Некоторые теги ничего не окружают, и их не надо закрывать. Пример – тег картинки

<img src="http://example.com/image.jpg">

Чтобы включать в текст документа угловые скобки, нужно пользоваться специальной записью, так как в HTML они имеют особое значение. Открывающая скобка (она же знак «меньше») записывается как &lt; («less than», «меньше, чем»), закрывающая — &gt; («greater that», «больше, чем»). В HTML амперсанд &, за которым идёт слово и точка с запятой, зовётся сущностью и заменяется символом, который кодируется этой последовательностью.

Это похоже на обратные слэши, используемые в строках JavaScript. Из-за специального значения амперсанда его самого в текст можно включать в виде &amp;. В атрибуте, заключаемом в двойные кавычки, символ кавычек записывается как &quot;.

HTML разбирается парсером довольно либерально по отношению к возможным ошибкам. Если какие-то теги пропущены, браузер их воссоздаёт. Как именно это происходит, записано в стандартах, поэтому можно ожидать, что все современные браузеры будут делать это одинаково.

Следующий документ будет обработан так же, как и предыдущий.

<!doctype html>
<title>Моя домашняя страничка</title>
<h1> Моя домашняя страничка </h1>
<p>Привет, я Марейн и это моя домашняя страничка.
<p>А ещё я книжку написал! Читайте её
<a href=http://eloquentjavascript.net>here</a>.

Отсутствуют теги <html>, <head> и <body>. Браузер знает, что <title> должен быть в <head>, а <h1> — в <body>. Кроме того, параграфы не закрыты, поскольку открытие нового параграфа или конец документа означают их принудительное закрытие. Также адрес не заключён в кавычки.

В этой книге мы опустим теги <html>, <head> и <body> для краткости. Но я буду закрывать теги, и заключать атрибуты в кавычки.

Также обычно я буду опускать doctype. Я не советую делать это вам – браузеры иногда могут творить странные вещи, когда вы их опускаете. Считайте, что они присутствуют в примерах по умолчанию.

Оглавление книги

Оглавление статьи/книги
Похожие страницы

Генерация: 0.093. Запросов К БД/Cache: 0 / 0
поделиться
Вверх Вниз