JavaScript заметки

Получи необходимые для работы навыки и умения вместе с каналом Senior JavaScript! У нас ты найдешь: ✔️ Теория. Разбор синтаксиса и особенностей языка ✔️ Практика. Тестовые задачи для проверки своих знаний ✔️ Ссылки на полезные Ютуб видео и статьи с Хабра Также мы периодически выкладываем самые свежие вакансии от компаний партнёров!

addEventListener Метод EventTarget.addEventListener() регистрирует определённый обработчик события, вызванного на EventTarget. Данный метод позволяет "вешать" несколько обработчиков одного и того же события на один элемент. Именно благодаря этому является более предпочтительным вариантом обработки событий. #браузер #документ #события

Регистр DOM-свойства имеет значение Используйте elem.onclick, а не elem.ONCLICK, потому что DOM-свойства чувствительны к регистру. #браузер #документ #события

💡 JavaScript - канал, в котором админ рассказывает сложный javascript человеческим языком. Подписывайся, если хочешь прокачать JS и повысить свой чек за работу - t.me/simple_js

Не используйте setAttribute для обработчиков Такой вызов работать не будет, т.к. setAttribute приводит все в строковый тип. #браузер #документ #события

True Figma - канал, где публикуются макеты Figma для практики вёрстки. Макеты для вёрcтки - @true_figma

Используйте именно функции, а не строки. Назначение обработчика строкой elem.onclick = "alert(1)" также сработает. Это сделано из соображений совместимости, но делать так не рекомендуется. #браузер #документ #события

Частые ошибки Если вы только начинаете работать с событиями, обратите внимание на следующие моменты. Функция должна быть присвоена как sayThanks, а не sayThanks(). Если добавить скобки, то sayThanks() – это уже вызов функции, результат которого (равный undefined, так как функция ничего не возвращает) будет присвоен onclick. Так что это не будет работать. #браузер #документ #события

Доступ к элементу через this Внутри обработчика события this ссылается на текущий элемент, то есть на тот, на котором, как говорят, «висит» (т.е. назначен) обработчик. В коде выше button выводит своё содержимое, используя this.innerHTML. #браузер #документ #события

Прекрати мечтать! Подтяни технический английский и начни искать работу за рубежом! Мы регулярно публикуем самые необходимые слова, выражения и тесты на английском языке из мира IT. Подойдет всем IT-специалистам, которые хотят без труда читать документацию и свободно общаться с иностранными заказчиками. Подписывайся на @enforit и качай свой инглиш, пока компилируется проект👌

HTML-атрибуты В HTML у тегов могут быть атрибуты. Когда браузер парсит HTML, чтобы создать DOM-объекты для тегов, он распознаёт стандартные атрибуты и создаёт DOM-свойства для них. Таким образом, когда у элемента есть id или другой стандартный атрибут, создаётся соответствующее свойство. Но этого не происходит, если атрибут нестандартный. #браузер #документ #атрибуты_свойств

HTML теперь в телеграм! HTML — самый популярный язык в мире. Именно на нем написаны все сайты. Начать свой путь в программировании проще всего с изучения HTML. Тем более теперь в телеграмме появился официальный русскоязычный канал. Это первоисточник всего, что появляется в платных курсах и остальных ресурсах. Стоит подписаться!

Обработчик в атрибуте и свойстве Обработчик всегда хранится в свойстве DOM-объекта, а атрибут – лишь один из способов его инициализации. Так как у элемента DOM может быть только одно свойство с именем onclick, то назначить более одного обработчика так нельзя. P.S. Два примера кода на картинке работают одинаково. #браузер #документ #события

Использование свойства DOM-объекта Можно назначать обработчик, используя свойство DOM-элемента on<событие>. К примеру, elem.onclick. Если обработчик задан через атрибут, то браузер читает HTML-разметку, создаёт новую функцию из содержимого атрибута и записывает в свойство. #браузер #документ #события

❇️ Мы создали специальный канал по льготной IT-ипотеке и новостройкам. Новости, ставки, статистика – все собрано в одном канале. ❗️Лучшие лоты и рекомендации по подбору новостроек. Поможем оформить ипотеку и приобрести новую квартиру без комиссий! 🌐 Проходите в канал, знакомьтесь с информацией, обсуждайте, обращайтесь с вопросами - разъясним. Подписывайтесь: https://t.me/itipoteka

Использование атрибута HTML Обработчик может быть назначен прямо в разметке, в атрибуте, который называется on<событие>. Например, чтобы назначить обработчик события click на элементе input, можно использовать атрибут onclick. #браузер #документ #события

Учить Python и другие языки программирования полезно и интересно, но еще интереснее может быть наблюдать за тем, как программисты создают свою IT-компанию. В канале «Программисты делают бизнес» основатели и ведущие сотрудники KTS рассказывают про будни компании, проблемы, с которыми они сталкиваются, и делятся своими мыслями и советами. Если вам интересно в онлайне следить за тем, как создается IT-компания, подписывайтесь!

Обработчики событий Событию можно назначить обработчик, то есть функцию, которая сработает, как только событие произошло. Именно благодаря обработчикам JavaScript-код может реагировать на действия пользователя. Есть несколько способов назначить событию обработчик. Мы их рассмотрим, начиная с самого простого. #браузер #документ #события

​​Совет на лето: изучите JavaScript. Средняя зарплата JavaScript-кодера по данным HeadHunter 152 000 рублей, а выучить его можно всего за 1-2 месяца. Главное, чтобы объяснили доступно. Этим и занимается разработчик с канала @true_js. Он укомплектовал инфу в простые уроки, чтобы любой научился кодить и получил работу через месяц. Никаких занудных учебников и бесполезных туториалов. Учиться программировать можно ПРЯМО в Телеграме. Дерзайте: @true_js

Введение в браузерные события Событие – это сигнал от браузера о том, что что-то произошло. Все DOM-узлы подают такие сигналы (хотя события бывают и не только в DOM). Вот список самых часто используемых DOM-событий, пока просто для ознакомления: События мыши: click – происходит, когда кликнули на элемент левой кнопкой мыши. contextmenu – происходит, когда кликнули на элемент правой кнопкой мыши. mouseover / mouseout – когда мышь наводится на / покидает элемент. mousedown / mouseup – когда нажали / отжали кнопку мыши на элементе. mousemove – при движении мыши. События на элементах управления: submit – пользователь отправил форму <form>. focus – пользователь фокусируется на элементе. Клавиатурные события: keydown и keyup – когда пользователь нажимает / отпускает клавишу. События документа: DOMContentLoaded – когда HTML загружен и обработан. CSS events: transitionend – когда CSS-анимация завершена. Существует множество других событий. О них в следующих постах. #браузер #документ #события