Конспект по завданню стр.2 із 15
У нашому прикладі атрибут href має значеня ="#".тобто ніякого як такового посилання не має.
але текст буде "засвічений" як той что має посилання.
Строки №9-№13 -формують блок що містить просто текст. Цікаве далі.
давайте подивимося, що буде відображати браузер, якщо тег буде оформлено у наступному "скороченому" форматі:
<a href="#" ">НАТИСНІ ТУТ ЩОБ ЩОСЬ ВІДБУЛОСЯ</a>
НАТИСНІ ТУТ ЩОБ ЩОСЬ ВІДБУЛОСЯ
бачимо,що у такому форматі тег <a> накладає як би гіперсилку, але це поситлання "перекидує нас на порчаток нашої торінки"
НАТИСНІ ТУТ ЩОБ ЩОСЬ ВІДБУЛОСЯ
Наступний атрибут Тегу <a> це атрибут "onclick".
Цей атрибут викликає подію за умови клацання лівою кнопкої миші.
у нашому випадку атрибут <a> має формат:
onclick="vyvod_nabr_ekran('test1')"
тут значенням атрибуту є функція:
vyvod_na_ekran('test1')
ця функція не є стандартною фукцією язиків программування, ми самостйно
придумали їй ім'я та описали цю функцію у розділі "script"...як саме розглянемо далі
test1 ми вже зустрічали саме так ми обьявили один з найперших у нашому лістингу ID.
ну це як би переменна.
<input type="text" id="test1"> тут буде така дія:
коли ми введемо літери у полі браузеру, той набор літер буде присвоєно переменній test1.
потім коли ми натиснемо фразу "НАТИСНІ ТУТ ЩОБ ЩОСЬ ВІДБУЛОСЯ" значення цієї переменої буде
передоно до функції vyvod_nabr_ekran(ID) бо маємо таке написання vyvod_nabr_ekran('test1')
Зараз перескочемо на аналіз листингу скрипта,за події відбуваються
тіло скрипта як правило розміщують внизу листинге сторінки, та тіло скрипта міститься внутри
тегів <script > </script >
const ANST01 = document.getElementById('ANST01');
тут сначала обьявлена переменная тип константа, ей дано имя ANST01
document.getElementById()
Возвращает ссылку на элемент по его идентификатору (ID); идентификатор является строкой, которая может быть использована для идентификации элемента; она может быть определена при помощи атрибута id в HTML или из скрипта.
/*const ANST01 = document.getElementById('ANST01');
не знаю зачем автор включил эту строку работает и без нее
*/
разберем функцию
function vyvod_na_ekran(inputId)
function- это обязательое слово- ключевое слово
vyvod_na_ekran - это имя функции которыо мы придумали сами и именно это имя можно использовать для вызова функции в листиинге страницы,
(inputId) -- это Список параметров (принимаемых функцией) заключённых в круглые скобки () и разделённых запятыми.
{ } --Инструкции, которые будут выполнены после вызова функции, заключают в фигурные скобки { }.
const element = document.getElementById(inputId); первая иснтрукция обявляет внутренюю пееменную по типу константа,
и этой переменной будет присвоена ссылка на элемент , который выступает в качетстве аргемента функции.
"element" - это им переменной которое мы придумали сами
вторая инструкция:
ANST01.innerText = element.value;
ANST01 - имя идентификатора в скрипте , мы придумали сами
.innerText - это свойство, позволяющее задавать или получать текстовое содержимое элемента и его потомков. В качестве геттера, свойство приближается к тексту, который пользователь получит, если он выделит содержимое элемента курсором, затем копирует его в буфер обмена.
.value
Метод Object.values() возвращает массив значений перечисляемых свойств объекта в том же порядке что и цикл for...in. Разница между циклом и методом в том, что цикл перечисляет свойства и из цепочки прототипов.
обект смесь
название
рецетуры
артикул
цена опт
фото
тип наценки это обьект
станд фасовкка опта