Структура HTML-документа / Подключение скриптов [11/14]
×

Подключение скриптов [11/14]

В вебе следующее разделение ролей: HTML отвечает за структуру документа, стили — за его внешний вид, а скрипты — за поведение. С помощью скриптов, например, можно «оживлять» страницу, добавляя анимацию и другие эффекты. Скрипты создаются с помощью языка JavaScript.

Скрипты подключаются так же, как и стили: их либо пишут внутри страницы, либо подключают как внешние файлы.

Встроенные скрипты пишут внутри тега <script>. Например:

<script>
  JavaScript-код
</script>

Тег <script> можно использовать в любом месте HTML-документа, но лучше вставлять его в самом конце перед закрывающим тегом </body>.

Часть возможностей JavaScript постепенно переходит в CSS, например, возможность задавать плавное изменение значений свойств. Вы увидите это в задании.

Хотите верстать адаптивно, использовать БЭМ и LESS? Тогда записывайтесь на наш продвинутый интенсив.

Выполнить задание
HTML
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Подключение скриптов</title> </head> <body> <h1>Подключение скриптов</h1> <p id="blinking">Подключение скриптов можно выполнять разными способами. Один из способов заключается в описании скриптов прямо внутри HTML-страницы.</p> <!--<script> var p = document.getElementById("blinking"); setInterval(function() { if (p.style.fontSize != "10px") { p.style.fontSize = "10px"; } else { p.style.fontSize = "20px"; } }, 2000); </script>--> </body> </html>
CSS
h1 { font-size: 28px; font-family: Monaco, Courier, monospace; color: #618ad2; } p { transition: font-size .5s; }
HTML Academy
  1. Раскомментируйте тег <script>.

Посмотрите, как подключенный скрипт оживит документ.

Теория Проверить Следующее задание
Идёт запись на курс Базовый HTML и CSS #16, который стартует 16 января.

Обсуждение и комментарии

Если у вас возникли сложности при прохождении задания, то вы можете обратиться за помощью на наш форум. Мы отслеживаем сообщения и постараемся ответить максимально быстро.

Пожалуйста, не пишите решение задач. Такие сообщения будут удаляться.

Перейти на форум или открыть комментарии.