Привет друзья! Сегодня мы с вами рассмотрим как подключить к элементам на странице событие onclick, мы его подключим к кнопке и к ссылке. Такое простое событие, как onclick в javascript, может быть вызвано несколькими способами. Событие происходит при клике по элементу левой кнопкой мыши. В нашем случае, чтобы назначить обработчик события click на элементе button, можно использовать атрибут onclick. При клике мышкой на кнопке выполнится код, указанный в атрибуте onclick. Т.к. мы там указали функцию, то выполнится именно она. 😊 ✅ Обработчик может быть назначен прямо в разметке, в атрибуте, который называется on_событие. ✅ Обратите внимание, что для передачи данных в функцию JS вызываемую событием onclick используются одинарные кавычки, так как сам атрибут находится в двойных кавычках. ❗ Код из видео расположен в конце описания. Ставь лайк, если тебе понравилось видео 👍 ►► Подписывайся на наш канал: / @wiseplat Рекомендую посмотреть вот эти видео ► ★ [Эффект бьющегося экрана TweenMax + html2canvas / Почти как игра] • Уроки Javascript / Эффект бьющегося экрана... ★ [Хранилище LocalStorage - учимся сохранять данные о пользователе в браузере] • Уроки Javascript / Хранилище LocalStorage ... ★ [Логические операции ИЛИ, НЕ, И] • Уроки Javascript / Логические операции ИЛИ... ★ [Конструкция switch case выбор по условию] • Уроки Javascript / Конструкция switch case... ★ [Как подключить фейерверк к сайту, новогодний салют в праздник] • Уроки Javascript / Как подключить фейервер... ★ [Как сделать эффект падающего снега за мышкой, снежинки следуют за курсором мыши] • Уроки Javascript. Как сделать эффект падаю... ★ [Как сделать новогоднюю открытку на вашем сайте, новогоднее поздравление!] • Уроки Javascript / Как сделать новогоднюю ... ★ [Как подключить новогоднюю гирлянду к вашему сайту, новогоднее украшение для сайта] • Уроки Javascript / Как подключить новогодн... ★ [Как сделать метель на сайте] • Уроки Javascript / Как сделать метель на с... ★ [Как подключить счетчик времени на сайт] • Урок Javascript / Как подключить счетчик в... ★ [Что такое JavaScript пишем первую программу] • Уроки Javascript / Что такое JavaScript пи... ★ [Как подключить JavaScript и вывести результат выполнения на экран] • Уроки Javascript / Как подключить и вывест... Где нас можно найти ► -------------------------------------------- Вступай в группу Вк -
https://vk.com/wiseplat 🚀 Группа FaceBook - / wiseplat Инстаграм Wiseplat: / wiseplat Instagram: / shpaginoleg Twitter - / wiseplatschool Популярные плейлисты ► -------------------------------------------- ● Уроки программирования для детей по Scratch • Программирование с нуля на Scratch ● Уроки программирования для детей и подростков на Python • Уроки Python программирование для начинающ... ● Уроки HTML/CSS. Учим быстро и эффективно! • Уроки HTML, CSS Как сделать галерею картинок ● Уроки JavaScript. Изучаем основы языка и практикуемся сразу. • Уроки JavaScript от нуля до профи ● Уроки jQuery. Для начинающих, с нуля • Уроки jQuery Подключение к сайту и актива... ● Уроки Bootstrap для начинающих, с нуля учимся сразу делать классно! • Уроки Bootstrap для начинающих, с нуля ● Компьютерное железо. Лайфхаки. Обзоры. Ноу-хау. Инструкции. Рекомендации. • Компьютерное железо. Лайфхаки. Обзоры. Ноу... ► Уроки на сайте Wiseplat: -------------------------------------------- ✔ Сообщество программистов:
✔ Дополнительное описание, домашние задания и многое другое можно найти на сайте WISEPLAT:
******************************** ❤ Если Вам понравилась публикация, подписывайтесь на канал! 👍 Ставьте лайки, тогда будем еще создавать такой контент :) ✉ Если есть вопросы или пожелания, то пишите, в комментариях. ******************************** Уроки от #OlegShpagin #урокиjavascript #урокиhtml #урокиcss Код из видео: [!DOCTYPE html] [html lang="en"] [head] [meta charset="UTF-8"] [title]tst js[/title] [script] function tstjs(){ //document.write("JS успешно запустился!"); document.getElementById("out_rez").append("JS успешно запустился!"); } function tsta(){ document.getElementById("out_rez_a").append("JS из тега A запустился!"); } [/script] [/head] [body] [h1]Тест запуска Javascript[/h1] [button onclick="tstjs()"]Запустить функцию из JS[/button] [div id="out_rez"][/div] [a href="#" onclick="tsta()"]Нажми меня![/a] [div id="out_rez_a"][/div] [/body] [/html] *** Не забываем, что Ютуб не дает писать угловые скобки – поэтому здесь они заменены на квадратные!!! – для использования кода - сделайте наоборот 😊
