Учебник по JavaScript
JavaScript – единственный язык программирования, встроенный в браузер. Он позволяет придать веб-страницам динамичность и интерактивность.
Обязательным условием для изучения JavaScript является знание двух других веб-технологий: HTML и CSS. В отличие от JavaScript, HTML и CSS – это языки для описания структуры и стилей веб-страниц.
1. Основы JavaScript
- Знакомство с JavaScript
- Условия и циклы
- Функции и область видимости
- Объекты и объектно-ориентированное программирование
- Массивы и их обработка
- Дата и время
- Математика (объект Math)
- Обработка ошибок, try...catch
- Глобальный объект
2. Асинхронный JavaScript
- Асинхронность в JavaScript. setTimeout и setInterval
- Изучение промисов с примерами
- Написание асинхронного кода с помощью async/await
3. JavaScript в браузере
-
Объектная модель браузера (BOM)
- Объектная модель браузера
- Объект window: открытие и закрытие окон
- Размеры окна и позиция прокрутки
- Перемещение окна и прокрутка страницы
- alert, prompt и confirm - диалоговые окна в JavaScript
- Объект window: фреймы
- Методы btoa и atob
- Объект Location - URL документа
- Объект Navigator – информация о браузере
- Объект History - история просмотра страниц
- Объект Screen – информация об экране
- Объект Document - содержимое окна браузера
-
DOM и его изменение
- Что такое DOM и зачем он нужен?
- Узлы и элементы DOM-дерева
- Структура и обход документа
- Методы для выбора HTML-элементов на странице
- Получение и установка контента элементам
- Работа с атрибутами и свойствами элементов
- Управление классами и стилями элементов
- Создание, вставка и удаление элементов
- Размеры и скроллинг элементов
- Браузерные события
- Хранение данных в браузере
4. Общение с сервером, AJAX
- Формат передачи данных JSON и методы для работы с ним
- Сбор данных с HTML-формы с помощью FormData
- Что такое AJAX? Создание асинхронных запросов
- Fetch API
- Назначение и применение AJAX при создании сайтов
5. UI компоненты на чистом JavaScript
- Todo List
- Вертикальный аккордеон
- Всплывающие сообщения
- Модальное окно
- Пользовательский (кастомный) Select
- Слайдер с несколькими активными элементами
- Слайдер с одним активным элементом
- Табы (вкладки)
- Таймер обратного отсчёта
- в которых используется серверный php-код
6. Примеры скриптов для решения различных задач на сайте
- Кнопка для прокрутки страницы вверх
- Ленивая подсветка синтаксиса кода с помощью highlight.js
- Оглавление для статей на сайте
- Подключение рекламы AdSense и РСЯ к сайту
- Прелоадер для сайта
7. Редакторы кода и IDE
8. Использование сторонних библиотек в веб-разработке
9. Библиотека jQuery
- Что такое jQuery? Загрузка и подключение к сайту
- С чего начинается написание кода на jQuery?
- Выбор, фильтрация и перемещение по элементам
-
Атрибуты, свойства, стили и классы
- Атрибуты элементов
- Добавление и удаление классов
- Работа с HTML, текстом и атрибутом value
- Добавление и удаление DOM-свойств (disabled, checked, selected и т.д.)
- Получение и установка CSS-свойств элементам
- Ширина и высота элементов (в планах)
- Позиционирование элементов
- data-атрибуты и внутреннее хранилище jQuery
- Манипуляции над элементами
- События и их обработка
-
Визуальные эффекты
- Управление видимостью (базовые эффекты)
- Создание анимации (в планах)
-
Ajax
- Сокращённые AJAX методы
- События AJAX (в планах)
- Получение данных формы
- Вспомогательные функции и методы jQuery