Как добавить переменную в html

Объявляем переменную

Мы переключили тему на странице, но строки с кодом получились длинными и трудночитаемыми. А ещё пришлось дважды искать с помощью querySelector один и тот же элемент. Мы его уже один раз нашли, зачем искать снова?

Выход есть! И имя ему — переменная.

Переменная — это способ сохранить данные, дав им понятное название.

В JavaScript переменную можно создать, или, как говорят программисты, объявить, с помощью ключевого слова let . За ним следует имя переменной. После объявления в переменную нужно записать, или присвоить, какое-то значение:

let variableName = 'Я значение переменной!';

Имя переменной может быть почти любым, но не должно начинаться с цифры, а из спецсимволов разрешены только ‘_’ и ‘$’. Кроме того, в JavaScript есть зарезервированные слова, которые нельзя использовать для именования переменных. Имена переменных чувствительны к регистру: header , Header и HEADER — это разные переменные. Но самое главное — чтобы переменная действительно делала код понятнее, её имя должно описывать то, что в ней хранится.

Сохранять в переменные можно что угодно, в том числе элементы:

let header = document.querySelector('header');

Когда в коде встречается переменная, браузер вместо её имени подставляет присвоенное ей значение. Благодаря этому мы можем написать, например, так:

console.log(header); header.classList.add('new-class');

Обратите внимание, что let мы пишем только при объявлении переменной. После этого мы используем переменную, просто указывая её имя.

Давайте создадим в нашей программе переменную и запишем в неё элемент с классом page . С помощью этой переменной мы сделаем наши инструкции короче и понятней. И заодно убедимся, что ничего не сломалось.

Ключевое слово let появилось в JavaScript в 2015 году, до этого для объявления переменных использовалось слово var . Оно работает почти так же, как let , но есть некоторые отличия. О них мы расскажем в следующих частях.

Перейти к заданию

• index.html Сплит-режим
• style.css Сплит-режим
• script.js Сплит-режим