Download "Модуль 7. Занятие 13. Объектная модель документа (DOM)(14/09)"

00:00:00 .querySelector() - null; querySelectorAll - []. 00:14:12 Код выполняется после построения DOM-дерева. 00:16:15 елемент.querySelector() на элементе. Выбрать в поддереве. 00:19:10 Юзкейс. Работа кнопки. 00:20:09 Свойства обьекта (свойства узла). html - элементы. 00:24:50 Замена 00:26:50 .textcontent. Замена и чтение текстового контента. 00:27:38 .getAtribute () как аналог обращения к свойству обьекта (напр., селектору) через точку. 00:30:11 Резюме по интерфейсу обращения к атрибутам. 00:30:50 Дата атрибуты для js в html. Произвольное имя с присвоенным значением. Дает возможность отслеживать (след. темы). 00:33:00 Особенности именования для селекторов используемых js. 00:33:40 псевдомассив.dataset - обращение к дата-атрибутам для добавления данных. Пример с кнопками. 00:38:20 Резюме. 00:39:30 .value как .textcontent, но для input 00:41:37 Как добавить стили. 00:42:30 .classList . Интерфейс для добавления/удаления классов тегов (по событию). 00:45:40 .classList.toggle(); переключение (добавление/удаление) классов. Напр., по событию. 00:46:32 .classList.replace - замена класса. 00:47:07 Резюме по коду. 00:47:40 .classList.contains(); - true/false 00:49:57 querySelector() . Поиск атрибута элемента. 00:52:14 Повесить атрибут на абстрактный элемент. 00:54:45 Ответы на вопросы. 00:58:21 Навигация по DOM. 00:59:50 Получить ссылку на элемент html-документа. 01:01:10 Свойства DOM. Второй способ получения ссылки на элемент в дереве. http://fecore.net.ua/books/m5ph3r-javascript/module-07/dom-traversal.html 01:06:13 Ответ на вопрос 01:07:21 .document.createElement() . Создание элементов. 01:08:35 Конструирование элемента DOM. Заголовок на странице. 01:10:29 Быстрый доступ к разделам документа. 01:11:21 Создание картинки. 01:14:05 Создание пункта меню со ссылкой и добавление в DOM-дерево. 01:21:31 .insertBefore() . 01:28:08 .append() . Добавление нескольких элементов в узел за одно обращение. 01:31:10 Ответ на вопрос. 01:32:19 Создание коллекции элементов. 01:36:09 Старый метод. 01:38:20 Распылением. 01:40:58 Использование .map() в DOM. 01:43:29 Оборачиваем в функцию. 01:49:15 Схема создания простой странницы. 01:55:48 export default - import. Работа в module (свойство script). 01:59:42 Функция получает один обьект и создает из него одну карточку продукта. Использование деструктуризации. 02:02:10 Много карточек через .map(). 02:04:57 Код создания элемента разметки - карточки. 02:07:10 Вопрос. flexbox на js. 02:08:45 .innerHTML . Создание разметки с использованием парса строк. 02:11:22 .innerHTML - заменить элемент полностью . Работа парсинга. ______ 02:15:24 .insertAdjacentHTML() - вставить после элемента. 02:20:30 Примерная схема разработки страницы. 02:21:40 Пример работы средствами браузера. Построение таблицы транзакций.