
Лаб_8 Головков И.Е. 12002108 JavaEE
.docxФЕДЕРАЛЬНОЕ ГОСУДАРСТВЕННОЕ АВТОНОМНОЕ ОБРАЗОВАТЕЛЬНОЕ УЧРЕЖДЕНИЕ ВЫСШЕГО ПРОФЕССИОНАЛЬНОГО ОБРАЗОВАНИЯ БЕЛОГОРОДСКИЙ ГОСУДАРСТВЕННЫЙ НАЦИОНАЛЬНЫЙ ИССЛЕДОВАТЕЛЬСКИЙ УНИВЕРСИТЕТ (НИУ «БелГУ») ИНСТИТУТ ИНЖЕНЕРНЫХ И ЦИФРОВЫХ ТЕХНОЛОГИЙ
КАФЕДРА ИНФОРМАЦИОННЫХ И РОБОТОТЕХНИЧЕСКИХ СИСТЕМ
Отчет по лабораторной работе №8 Тема работы «Основы разработки и стилизации web-контента» по дисциплине «Концепция создания модульных приложений»
студента очного отделения
2 курса группы 12002108
Головкова Игоря Евгеньевича
Проверил:
ст. пр. Гончаров Дмитрий Викторович
Белгород 2023
Страница 1 «Главная»
Страница 2 «Меню»
Страница 3 «Скидки»
Страница 4 «Заказ»
Сайт доступен по адресу: https://iggosha.github.io/index.html
Листинг
Теги <header>, <nav> и <footer>
<header> <h1>Фудзи-Суши</h1> <img src="icon.png" alt="Логотип" class="logo"> </header> <nav> <ul> <li><a href="index.html">Главная</a></li> <li><a href="MenuPage.html">Меню</a></li> <li><a href="PromoPage.html">Скидки</a></li> </ul> </nav>
<!-- Бегущая строка --> <footer> <MARQUEE>Заказывайте наши ароматные и вкусные блюда! Приятного аппетита! Связь с поддержкой: Почта: fuji-sushi@mail.ru, Телефон: 8(800)555-35-35 </MARQUEE> </footer>
Метки на интерактивной карте
Магистральная улица, 2В <iframe src="https://yandex.ru/map-widget/v1/?indoorLevel=1&ll=36.538543%2C50.573224&mode=search&ol=geo&ouri=ymapsbm1%3A%2F%2Fgeo%3Fdata%3DCgg1NTk4NzU4MRJK0KDQvtGB0YHQuNGPLCDQkdC10LvQs9C-0YDQvtC0LCDQnNCw0LPQuNGB0YLRgNCw0LvRjNC90LDRjyDRg9C70LjRhtCwLCAy0JIiCg15JxJCFftKSkI%2C&z=17.16" width="300" height="300" allowfullscreen="true" style="position:relative;"> </iframe>
Ссылки на соцсети
<article style="font-size: 1.5em"> <h1>Наши соцсети:</h1> ВКонтакте: <a href="https://vk.com"><img src="img/ВК_ИКОНКА.png" alt="ВК" class="networks"></a><br> Telegram: <a href="https://t.me"><img src="img/ТЕЛЕГРАММ_ИКОНКА.png" alt="ТЕЛЕГРАММ" class="networks"></a><br> Дзен: <a href="https://dzen.ru"><img src="img/ДЗЕН_ИКОНКА.png" alt="ДЗЕН" class="networks"></a><br> Instagram: <a href="https://www.instagram.com"><img src="img/ИНСТАГРАМ_ИКОНКА.png" alt="ИНСТАГРАМ" class="networks"></a><br> YouTube: <a href="https://www.youtube.com"><img src="img/ЮТУБ_ИКОНКА.png" alt="ЮТУБ" class="networks"></a><br> </article>
Поле для ввода электронной почты и кнопка, вызывающая JS-функцию генерации промокода
<section style="border: 5px dashed #ccccff; border-radius: 0;"> <h3>Введите свою почту и получите промокод на скидку при втором заказе: </h3> <label> <input type="email" id="emailField" placeholder="myemail@site.com"/> </label> <input type="button" onclick="checkEmail(emailField);" value="Получить" style="width: 200px; height: 100px"/> </section>
// Функция
function checkEmail(textField) { let mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/; let promocode = (Math.random()).toString(16); promocode = promocode.replace("0.", " "); promocode = promocode.toUpperCase(); if(textField.value.match(mailformat)) { alert("Ваш промокод: " + promocode); } { alert else ("Электронная почта введена неверно!"); } }
JS-функция для составления заказа
let text = ""; function addProducts() { let counter = 0; for (let amount of document.getElementsByClassName('amounts')) { let pr = document.getElementsByClassName('products')[counter++].textContent; let am = amount.textContent; if (am != 0) { text += pr + ": " + am + "<br>"; } } } function openOrderWindow() { let win = window.open("", "", "width=720,height=480"); win.document.open(); win.document.write('<head> <title>Заказ</title> <link rel="stylesheet" href="css/mystyle.css"/> <script src="js/makeOrder.js"></script> </head>'); win.document.write("<h1>Ваш заказ:</h1>"); if (text != "") { win.document.write(text); } else { win.document.write("Ничего не выбрано<br>"); } win.document.write("<br> Введите адрес для доставки: <br> "); win.document.write("<label>\n" + " <input type=\"email\" id=\"emailField\" placeholder=\"ул. Уличная, дом 1, кв 1\"/>\n" + " </label> <br>"); win.document.write('<input type="button" value="Заказать" onClick="window.close();" style="width: 200px; height: 75px">'); win.document.write('<h6 style="text-align: right; font-size: 0.5em">При ошибке перезагрузите главную страницу</h6>'); win.document.close(); text = ""; }