diff --git a/src/SUMMARY.md b/src/SUMMARY.md
index 2184f48..787598e 100644
--- a/src/SUMMARY.md
+++ b/src/SUMMARY.md
@@ -47,3 +47,4 @@
- [Поиск элементов в DOM](web_apis/querying_dom_elements.md)
- [Работа с текстом элемента](web_apis/working_with_element_text.md)
- [Поиск элементов внутри других элементов](web_apis/querying_elements_inside_other_elements.md)
+ - [События](web_apis/events.md)
diff --git a/src/web_apis/events.md b/src/web_apis/events.md
new file mode 100644
index 0000000..e513e99
--- /dev/null
+++ b/src/web_apis/events.md
@@ -0,0 +1,52 @@
+# События
+
+Когда пользователь совершает какое-то действие на веб-странице, считается, что произошло событие. Существует множество типов событий, например `click` — пользователь нажал на элемент, `mouseover` — пользователь навёл курсор на элемент, `keydown` — пользователь нажал клавишу на клавиатуре и т.д.
+
+Для создания интерактивных страниц нужно, чтобы при возникновении определённого события выполнялся определённый код. Для этого у каждого элемента есть метод `addEventListener`, который позволяет зарегистрировать обработчик события. Метод в качестве аргументов принимает тип события и функцию-обработчик, которую браузер будет вызывать каждый раз, когда на данном элементе будет происходить событие данного типа.
+
+Например, ниже показано, как добавить кнопке обработчик события `click`, чтобы при каждом её нажатии браузер показывал диалоговое окно.
+
+```html
+
+```
+
+```js
+function handleButtonClick() {
+ alert("The button was clicked");
+}
+
+const button = document.querySelector("button");
+button.addEventListener("click", handleButtonClick);
+```
+
+Функция-обработчик может принимать параметр, в который будет передан объект с информацией о событии. Чаще всего у этого объекта используется свойство `target`, которое содержит объект элемента, на котором событие произошло.
+
+Это может быть полезно, когда один и тот же обработчик используется сразу на нескольких элементах. Например, ниже показана страница, на которой уже несколько кнопок, а в диалоговом окне показывается, какая именно из них была нажата.
+
+```html
+
+
+
+```
+
+```js
+function handleButtonClick(event) {
+ alert(event.target.innerText + " was clicked");
+}
+
+const buttons = document.querySelectorAll("button");
+
+for (let i = 0; i < buttons.length; i++) {
+ buttons[i].addEventListener("click", handleButtonClick);
+}
+```
+
+## Упражнения
+
+1. Реализуй страницу, на которой отображается число, изначально `0`. При каждом клике на число оно должно увеличиваться на единицу.
+
+1. Реализуй страницу, на которой отображаются два числа, изначально оба `0`. При каждом клике на число это число должно увеличиваться на единицу.
+
+1. Реализуй страницу, на которой отображается несколько символов стрелочек. Стрелочка может указывать в одном из восьми направлений: `↑`, `↗`, `→`, `↘`, `↓`, `↙`, `←` или `↖`. Изначально все стрелочки указывают вверх. При каждом клике на любую стрелочку эта стрелочка должна "поворачиваться" на 45° по часовой стрелке.
+
+1. Реализуй страницу с игрой в крестики-нолики. На странице отображается квадратное поле размером 3 на 3 ячейки. При клике на пустую ячейку в ней появляется либо крестик `X`, либо нолик `O`, в зависимости от того, кто из двух игроков делает ход. Игроки ходят по очереди, первым ходит игрок с крестиками.