Локальное хранилище
Демо можно найти здесь.
Чему я научился на этом мини-проекте.
предотвращениепо умолчанию
Это полезно, если вы хотите остановить отправку формы, которая по умолчанию перенаправляет вас на страницу обработки формы.
литеральный тернарный оператор шаблона
Действительно классная функция, реализованная в этом проекте, заключалась в использовании тернарного оператора для выбора, нужно ли добавлять атрибут к тегу input.
Здесь тернарный оператор либо добавит checked, либо ничего не добавит, в зависимости от логического значения, возвращаемого из plate.done.
событие.цель
При присоединении прослушивателей событий к элементам может потребоваться доступ к данным из них.
В случае элементов формы с inputs и labels и т. д. вы не сможете различить, какой из них был нажат.
Используя event.target, а это matches метод, вы можете сузить свой выбор до нужного вам элемента.
В этом примере будут возвращены все элементы, по которым щелкнули, кроме input's.
делегация мероприятия
Если вы хотите прикрепить прослушиватель событий к элементу, который не существует при загрузке страницы, необходимо event delegation.
Эта концепция работает путем присоединения прослушивателя событий к родительскому элементу (который существует), который затем передает инструкцию (делегаты) целевому дочернему элементу.
itemsList — это родительский элемент, который делегирует инструкцию элементам event.target.
местное хранилище
Браузеры теперь имеют возможность хранить локальные данные для отдельных веб-страниц и браузеров. Данные хранятся в виде строки, которую можно преобразовать в объекты javascript.
Вы можете устанавливать и получать предметы из localStorage.
Здесь необходимо использовать JSON.stringify(), так как это позволяет преобразовать пары ключ-значение объекта в его строковое представление.
Ниже показан пример, демонстрирующий использование данных и добавление их в переменную для использования между перезагрузками браузера.
Это позволяет вашим страницам иметь преемственность, основанную на существующем поведении пользователей.
Здесь 'items' относится к строковой интерпретации объекта, а JSON.parse преобразует строку обратно в объект javascript, готовый к использованию.
Первоначально опубликовано на gist.github.com.
