Основы работы с DOM в JavaScript

В предыдущих уроках мы изучали базовые возможности языка JavaScript. Начиная с данного урока мы займемся тем, для чего собственно JavaScript и предназначен - мы будем изменять элементы HTML страницы и реагировать на действия пользователя. Наши скрипты станут более зрелищными и полезными.

Во всех следующих уроках ваш JavaScript код должен быть размещен ниже HTML кода, к которому он обращается. То есть структура вашего кода должна выглядеть следующим образом:

<!DOCTYPE html>
<html>
	<head>
		
	</head>
	<body>
		ваши html теги
		
		<script>
			ваш JavaScript код
		</script>
	</body>
</html>

Либо следующим образом, если вы пишите JavaScript код в отдельном файле:

<!DOCTYPE html>
<html>
	<head>
		
	</head>
	<body>
		ваши html теги
		
		<script src="index.js"></script>
	</body>
</html>

В дальнейшем для краткости я не буду приводить полный код, а буду просто указывать, что нужно писать в HTML части, а что - в JavaScript части.

Сделайте файл с указанной структурой кода.