Задание 2.
- Создать файл date2.htm — копию html-файла date1.htm из Задания 1.
- Код, использовавшийся для формирования даты, поместить в функцию showDate(), которая должна возвращать код разметки.
- Определение функции поместить в заголовочную часть документа.
- Добавить в тело документа код для вывода даты с помощью функции showDate().
- Убедиться, что страница формируется правильно.
- Создать файл date3.htm — копию html-файла date2.htm.
- Создать в той же папке новый файл showDate.js, в который скопировать определение функции showDate().
- В заголовочной части date3.htm заменить определение функции на подключение файла showDate().
- Убедиться, что страница формируется правильно.
В результате у Вас в файле date2.html получится код:
<html> <head> <title>Вывод даты.</title> <style> #s1 { background: #ffff00; /* Цвет фона желтый */ color: red; /* Цвет текста */ max-width: 150px; /* Максимальная ширина элемента*/ margin-left: auto; /* Отступ слева. Размер будет автоматически рассчитан браузером */ margin-right: auto; /* Отступ справа */ font-weight: bold; /* Для выделения текста жирным шрифтом */ } </style> <sсript type="text/javascript"> function ShowDate(){ var date, day, month, year,currentDate; date=new Date(); // получение полной информации о текущей дате day=date.getDate(); // номер дня месяца month=date.getMonth()+1; // номер месяца, отсчитывается от нуля year=date.getFullYear(); // год четырьмя цифрами //формирование строки для вывода, плюс — конкатенация currentDate = '<p id="s1">' + '<b>' + 'Сегодня: ' + '<span style="color: teal;">' + '<u>' + day + '</u>' + "-" + month + "-" + year + '</span>' + '</b>' + '</p>'; return currentDate; </sсript> </head> <body> <div> <sсript type="text/javascript"> document.write(ShowDate()); </sсript> </div> </body> </html> |
В результате у Вас в файле date3.html получится код:
<html> <head> <title>Вывод даты.</title> <style> #s1 { background: #ffff00; /* Цвет фона желтый */ color: red; /* Цвет текста */ max-width: 150px; /* Максимальная ширина элемента*/ margin-left: auto; /* Отступ слева. Размер будет автоматически рассчитан браузером */ margin-right: auto; /* Отступ справа */ font-weight: bold; /* Для выделения текста жирным шрифтом */ } </style> <sсript src="ShowDate.js"> </sсript> </head> <body> <div> <sсript type="text/javascript"> document.write(ShowDate()); </sсript> </div> </body> </html> |
А в файле showDate.js будет следующий код:
var date, day, month, year,currentDate; function ShowDate(){ date=new Date(); day=date.getDate(); month=date.getMonth()+1; year=date.getFullYear(); currentDate = '<p id="s1">' + '<b>' + 'Сегодня: ' + '<span style="color: teal;">' + '<u>' + day + '</u>' + "-" + month + "-" + year + '</span>' + '</b>' + '</p>'; return currentDate; } |