onclick javascript примеры

Событие onclick - это событие JavaScript, которое происходит при нажатии пользователем на элемент. Это событие может быть привязано к любому HTML-элементу и используется для выполнения определённого кода при нажатии. В этой статье рассмотрим различные примеры использования этого события.

Пусть у нас есть следующая кнопка:

<button id="btn">btn</button>

Получим ссылку на нашу кнопку с помощью метода querySelector:

let btn = document.querySelector('#btn');

Давайте рассмотрим три различных способа навешивания события onclick на нашу кнопку.

Пример 1

Навесим на кнопку обработчик события onclick с помощью метода addEventListener:

btn.addEventListener('click', function() {
	console.log('!!!');
});

Пример 2

Навесим на кнопку обработчик события с помощью свойства onclick:

btn.onclick = function() {
	console.log('!!!');
};

Пример 3

Дана следующая функция:

function func() {
	console.log('!!!');
};

Навесим эту функцию на кнопку в качестве реакции на клик с помощью HTML атрибута onclick:

<button id="btn" onclick="func()">btn</button>