frontend | ежица-разработчица

Привет! Пост о коллекциях HTML-элементов. Что такое, почему не массив, она живая или нет, они еще и разные и так далее 📝 Сначала определения: коллекция HTML-элементов - набор элементов веб-страницы, порядок в котором соответствует порядку в DOM. 📝 Бывают живые коллекции и статические - живую можно изменить с помощью js, а статическую нет. 📝 Есть две разных структуры данных HTMLCollection и NodeList: HTMLCollection - это только HTML-теги, а NodeList- это еще и текст, оставшийся без тега, и, например, комментарий...

2 года назад

Методы и свойства, родители и потомки в DOM

Привет! Поговорим о методах и свойствах js, связанных с родителями и потомками в DOM-дереве Сначала немного определений: чем отличаются дочерние узлы и дочерние элементы? 📝Дочерние элементы - это прямые потомки элемента, а дочерние узлы - это потомки вместе со своими потомками и так далее Итак, методы и свойства js, связанные с темой: ➡️ contains - возвращает Boolean-значение, проверяет, является ли элемент дочерним узлом другого элемента: item.contains(list) - является ли item дочерним узлом...

2 года назад

Привет! Про медиа-запросы в js-коде: Например, у нас js-поведение блока зависит от размера экрана, добавим переменную: let x = window.matchMedia("(max-width: 700px)") и дальше можно по условию выполнять действия. Документация: https://www.w3schools.com/howto/howto_js_media_queries.asp🔗 #js #frontend

2 года назад

Полезные расширения Chrome

Для frontend-разработчиков Привет! Полезные расширения для Chrome: ➡️ ColorZilla - пипетка, получить цвет с любого места веб-страницы 🔗 ➡️ Perfect Pixel - сверить с макетом путем наложения на страницу 🔗 ➡️ Vue Devtools - просмотр компонентов Vue, state, данных, время выполнения запросов 🔗 ➡️ React Developer Tools - просмотр компонентов React 🔗 ➡️ Redux Developer Tools - к React в комплект, state, данные, время 🔗 ➡️ Wappalyzer - узнать стек сайта 🔗 ➡️ Project Naptha - скопировать текст...

2 года назад

Как скопировать массив или объект в JS?

Привет! Как скопировать массив или объект в javascript? 1) Копирование массива const names = ['Oliver', 'Sophia', 'William', "Emma', 'Ethan']; /* неправильно, copyNames содержит ссылку на names, при изменении элементов copyNames изменится names */ const copyNames = names; /* правильно, copyNames независимая копия, под неё в памчти выделено собственное место и её можно менять не изменяя names */ const copyNames = names.slice(); /* так тоже можно скопировать массив */ const copyNames = [...names];...

2 года назад