Мое дз (Javascript)
Перед Вами очень интересная задача. Она называется "Времена года".
На странице должен быть отображен вопрос: "Какой месяц года проверить?"
В отдельном текстовом окошке пользователь вводит название одного из
12 месяцев календарного года. Далее, поблизости следует расположить
управляющую кнопку с надписью "Обработать информацию". При нажатии
на данную кнопку приложение должно определить, к какому времени года
относится этот месяц и вывести на экран картинку, соответствующую
этому времени года. Используйте в качестве примера программу,
которую мы разрабатывали на занятии. Креатив приветствуется.
Удачи!
Код Html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Время суток</title>
<link rel="stylesheet" href="style.css">
<script src="script.js"></script>
</head>
<body>
<h1>Приложение "Времена года"</h1>
<hr>
<main>
<label for="vre">Какой месяц года проверить?(все слова должны писатся с большой буквы)</label>
<input type="text" id="vre">
<button id="b1">Обработать информацию</button>
<div id="image_box">
<img id="image" src="hello.png">
</div>
</main>
<hr>
<h5>Copyright: © Teacher - Kyiv, 2019</h5>
</body>
</html>
Код JS
"use strict";
window.onload = function () {
let b1 = document.getElementById("b1");
let vre = document.getElementById("vre");
let image = document.getElementById("image");
b1.onclick = function () {
let v = vre.value;
if (v = Декабрь, Январь, Февраль) {
alert("Зима");
image.src = "morning.png";
} else if (v = Март, Апрель, Май) {
alert("Весна");
image.src = "afternoon.png";
} else if (v = Июнь, Июль, Август) {
alert("Лето");
} else if (v = Сентябрь, Октябрь, Ноябрь) {
alert("Осень");
} else {
alert("Вы ввели неверный месяц");
}
};
};
Ответы
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Время суток</title>
<style>
h5 {
width: fit-content;
}
h5:hover::after {
content: "<----KEK";
}
</style>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body>
<header>
<h1>Приложение "Времена года"</h1>
</header>
<hr />
<main>
<label for="vre">Какой месяц года проверить?</label>
<input type="text" id="vre" />
<button id="b1">Обработать информацию</button>
<div id="image_box">
<img id="image" src="hello.png" />
</div>
</main>
<hr />
<footer>
<h5>Copyright: © Teacher - Kyiv, 2019</h5>
</footer>
<script>
"use strict";
(function() {
const b1 = document.getElementById("b1");
b1.onclick = function() {
const vre = document.getElementById("vre");
const image = document.getElementById("image");
if (vre.value.match(/(декаб|янва)рь|февраль/gi)) {
alert("Зима");
image.src = "winter.png";
} else if (vre.value.match(/март|апрель|май/gi)) {
alert("Весна");
image.src = "spring.png";
} else if (vre.value.match(/ию(л|н)ь|август/gi)) {
alert("Лето");
image.src = "summer.png";
} else if (vre.value.match(/(сент|окт|но)ябрь/gi)) {
alert("Осень");
image.src = "autumn.png";
} else {
alert("Вы ввели неверный месяц");
}
};
})();
</script>
</body>
</html>