Уроки Javascript / Запуск кода JS при клике на кнопку или ссылку, подключаем событие onclick
Привет друзья! Сегодня мы с вами рассмотрим как подключить к элементам на странице событие onclick, мы его подключим к кнопке и к ссылке. Такое простое событие, как onclick в javascript, может быть вызвано несколькими способами. Событие происходит при клике по элементу левой кнопкой мыши. В нашем случае, чтобы назначить обработчик события click на элементе button, можно использовать атрибут onclick. При клике мышкой на кнопке выполнится код, указанный в атрибуте onclick. Т.к. мы там указали функцию, то выполнится именно она. 😊
✅ Обработчик может быть назначен прямо в разметке, в атрибуте, который называется on_событие.
✅ Обратите внимание, что для передачи данных в функцию JS вызываемую событием onclick используются одинарные кавычки, так как сам атрибут находится в двойных кавычках.
❗ Код из видео расположен в конце описания.
Ставь лайк, если тебе понравилось видео 👍
►► Подписывайся на наш канал:
Рекомендую посмотреть вот эти видео ►
★ [Эффект бьющегося экрана TweenMax html2canvas / Почти как игра]
★ [Хранилище LocalStorage - учимся сохранять данные о пользователе в браузере]
★ [Логические операции ИЛИ, НЕ, И]
★ [Конструкция switch case выбор по условию]
★ [Как подключить фейерверк к сайту, новогодний салют в праздник]
★ [Как сделать эффект падающего снега за мышкой, снежинки следуют за курсором мыши]
★ [Как сделать новогоднюю открытку на вашем сайте, новогоднее поздравление!]
★ [Как подключить новогоднюю гирлянду к вашему сайту, новогоднее украшение для сайта]
★ [Как сделать метель на сайте]
★ [Как подключить счетчик времени на сайт]
★ [Что такое JavaScript пишем первую программу]
★ [Как подключить JavaScript и вывести результат выполнения на экран]
Где нас можно найти ►
--------------------------------------------
Вступай в группу Вк - 🚀
Группа FaceBook -
Инстаграм Wiseplat:
Instagram:
Twitter -
Популярные плейлисты ►
--------------------------------------------
● Уроки программирования для детей по Scratch
● Уроки программирования для детей и подростков на Python
● Уроки HTML/CSS. Учим быстро и эффективно!
● Уроки JavaScript. Изучаем основы языка и практикуемся сразу.
● Уроки jQuery. Для начинающих, с нуля
● Уроки Bootstrap для начинающих, с нуля учимся сразу делать классно!
● Компьютерное железо. Лайфхаки. Обзоры. Ноу-хау. Инструкции. Рекомендации.
► Уроки на сайте Wiseplat:
--------------------------------------------
✔ Сообщество программистов:
✔ Дополнительное описание, домашние задания и многое другое можно найти на сайте WISEPLAT:
********************************
❤ Если Вам понравилась публикация, подписывайтесь на канал!
👍 Ставьте лайки, тогда будем еще создавать такой контент :)
✉ Если есть вопросы или пожелания, то пишите, в комментариях.
********************************
- Уроки от #OlegShpagin
#урокиjavascript #урокиhtml #урокиcss
Код из видео:
[!DOCTYPE html]
[html lang=“en“]
[head]
[meta charset=“UTF-8“]
[title]tst js[/title]
[script]
function tstjs(){
//(“JS успешно запустился!“);
(“out_rez“).append(“JS успешно запустился!“);
}
function tsta(){
(“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]
*** Не забываем, что Ютуб не дает писать угловые скобки – поэтому здесь они заменены на квадратные!!! – для использования кода - сделайте наоборот 😊
171 view
208
43
3 months ago 02:39:26 1
React & ИНТЕРНЕТ МАГАЗИН С НУЛЯ. PERN stack PostgreSQL + express + React js +
4 months ago 00:02:43 3
Dart с нуля до профи | #0 Введение | Курс для начинающих 2023
4 months ago 01:53:01 1
Полный курс по Next js - Изучи Nextjs за 2 часа! | React SSR +таймкоды
4 months ago 00:17:48 6
Web Dev полый курс с нуля. Урок 1. Введение. План разработки
4 months ago 00:38:44 4
Уроки по Scratch. Делаем игру бургермания Burgermania на скретч. Часть 6
4 months ago 18:17:32 1
Vue JS - Полный курс c нуля | Result University
4 months ago 00:08:49 1
Laravel для новичков #16 - Основная секция главной страницы
4 months ago 00:43:54 10
Уроки по Scratch. Делаем игру Burger Mania Бургермания на скретч. Часть 5
4 months ago 00:12:33 49
5 больших изменений во 3.5 за 12 минут!
4 months ago 00:04:04 1
Laravel для новичков #15 - Перемещение пунктов навигации и ссылок на социальные сети в конфигурацию
4 months ago 00:37:12 9
Уроки по Scratch. Делаем игру Burger Mania Бургермания на скретч. Часть 4
4 months ago 00:05:16 4
Laravel для новичков #14 - Компонент иконки
4 months ago 00:33:24 10
Уроки по Scratch. Делаем игру Burger Mania Бургермания на скретч. Часть 3
4 months ago 00:00:00 1
Первый урок на курсе “Frontend разработчик: JavaScript + React“. г.
4 months ago 00:05:35 3
Laravel для новичков #13 - Активный пункт навигации
4 months ago 00:36:28 11
Уроки по Scratch. Делаем игру Бургер мания Burger mania на скретч. Часть 2
4 months ago 00:10:15 1
Laravel для новичков #12 - Перемещение пунктов навигации в layout
4 months ago 00:06:25 1
Laravel для новичков #11 - Компоненты подвала
4 months ago 00:33:32 11
Уроки по Scratch. Делаем игру Burger Mania Бургер Мания на Скретч. Часть 1
4 months ago 00:09:20 1
Laravel для новичков #10 - Подвал
4 months ago 00:07:28 1
Laravel для новичков #9 - Компоненты шапки
4 months ago 00:05:09 1
Laravel для новичков #7 - Маршруты страниц
4 months ago 00:05:06 1
Laravel для новичков #8 - Компонент layout
4 months ago 00:07:12 1
Laravel для новичков #6 - Интерполяция в blade-шаблонах