Результат работы программы
Рисунок 10 – Задание 10.
Задание 11
Создать в одной функции часы в окне документа в 24-часовом формате, а также вывести текущую дату, указав название месяца на русском языке.
Листинг кода
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
body {
background:linear-gradient(to left,#111,#221c44);
color: hsl(0, 0%, 100%);
text-align:center;
font-size: 120%;
}
#clock {
font-family: 'Orbitron', sans-serif;
color: hsl(244, 61%, 49%);
font-size: 56px;
text-align: center;
padding-top: 40px;
padding-bottom: 40px;
}
</style>
<title>Задание 11</title>
</head>
<body class=".body">
<h1>Задание 11</h1>
<P>Создать в одной функции часы в окне документа в 24-часовом формате, а также вывести текущую дату, указав название месяца на русском языке<P>
<div id="clock"></div>
<script>
//Функция "часы"
function clock(){
// Создание объекта Date
let date = new Date();
// Массив с названием месяцев
let months =["Января", "Февраля", "Марта", "Апреля", "Мая", "Июня", "Июля", "Августа", "Сентября", "Октября", "Ноября", "Декабря"];
// Массив с названиями дней недели
var days =["Воскресенье", "Понедельник", "Вторник", "Среда", "Четверг", "Пятница", "Суббота"];
// Получение значения времени с помощью методов
hours = (date.getHours() < 10) ? '0' + date.getHours() : date.getHours(),
minutes = (date.getMinutes() < 10) ? '0' + date.getMinutes() : date.getMinutes(),
seconds = (date.getSeconds() < 10) ? '0' + date.getSeconds() : date.getSeconds();
// Получение даты и вывод в окно документа
document.getElementById('clock').innerHTML = date.getDate() +' '
+' '+ months[date.getMonth()] +' '+ date.getFullYear() +' года <br>'+ hours + ':' + minutes + ':' + seconds +'<br>'+ days[date.getDay()];
}
setInterval(clock, 1000);
clock();
</script>
</body>
</html>
Результат работы программы
Рисунок 11 – Задание 11.
Задание 12
Определить, сколько дней осталось до нового учебного года.
Листинг кода
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
body {
background:linear-gradient(to left,#111,#221c44);
color: hsl(0, 0%, 100%);
text-align:center;
font-size: 120%;
}
#daysLeftNewAcademicYear {
font-family: 'Orbitron', sans-serif;
color: hsl(244, 61%, 49%);
font-size: 56px;
text-align: center;
padding-top: 40px;
padding-bottom: 40px;
}
</style>
<title>Задание 12</title>
</head>
<body class=".body">
<h1>Задание 12</h1>
<P>Определить, сколько дней осталось до нового учебного года.<P>
<div id="daysLeftNewAcademicYear"></div>
<script>
function daysLeftNewAcademicYear(){
let msOneDay, daysLeft;
// Дата "сегодня"
let today = new Date();
// Дата нового учебного года
let nextDate = new Date("September 1, 2023");
// Количество миллисекунд в одном дне
msOneDay = 24*60*60*1000;
// Вычисление количество дней до нового учебного года
daysLeft = Math.round((nextDate.getTime() - today.getTime())/msOneDay);
// Массив с названием месяцев
let months =["Января", "Февраля", "Марта", "Апреля", "Мая", "Июня", "Июля", "Августа", "Сентября", "Октября", "Ноября", "Декабря"];
// Вывод в окно документа
document.getElementById('daysLeftNewAcademicYear').innerHTML = today.getDate() +' '+ months[today.getMonth()] +' '+ today.getFullYear()+
' года <br> До нового учебного года осталось: '+ daysLeft +' дней(я)';
}
daysLeftNewAcademicYear();
</script>
</body>
</html>