General
[Lynda.com] — Понимание DOM-модели
Объектная модель документа (DOM) лежит в основе каждой HTML страницы.
В целях создания динамических HTML страниц, интерфейсный разработчик должен понимать, как с помощью JavaScript контролировать DOM, как создавать, изменять, удалять и редактировать содержимое страницы.
Этот курс призван помочь вам понять DOM элементы и показывает различные способы получения доступа к ним с помощью JavaScript.
Курс охватывает такие вопросы, как навигация по DOM, выбор элементов, изменение HTML атрибутов, редактирование узлов и многое другое.
Goal Accomplishment Criteria
Материал изучен
-
Начинаем работу с DOM
- Объектная модель документа - DOM
- Инструменты разработчика
- Консоль JavaScript
- Взаимодействие с консолью
-
Выбор элементов DOM
- Выбор элементов с помощью getElementById
- Выбор элементов по HTML тегу
- Выбор элементов по имени класса
- Выбор элементов с помощью CSS
- Работа с именованными элементами формы
- Понимание nodeType, nodeName, nodeValue
- Переход по узлам DOM
- Таргетинг элементов узлов
-
Изменение DOM атрибутов и контента
- Изменение HTML атрибутов
- Работа с зарезервированными атрибутами
- Обнаружение атрибутов
- Контроль классов с помощью HTML5 classList
- Таргетинг по свойствам атрибутов
- Изменение содержимого элементов
- Изменение текста элементов
-
Создание и удаление узлов
- Создание узлов
- Использование insertBefore
- Клонирование и удаление узлов
- Замена существующих узлов
-
DOM в действии
- Что мы создадим
- Добавление обработчика событий
- Создание оверлея с помощью JavaScript
- Добавление изображения
- Изменение размера изображения в DOM
- Центрирование изображения
- Обработка кликов
- Настройка скроллинга
- Обнаружение изменения размеров окна
Don't miss new posts!
Subscribe for the Goal and follow through to its completion
