Задачи для решения
Дан ul, в нем несколько li. Под ul сделайте кнопку, по нажатию на которую в конец ul будет добавляться новый li с текстом 'пункт'. Сделайте так, чтобы при клике на каждый li, ему в конец добавлялся '!'. Это должно работать и для вновь добавленных li. Задачу решите с помощью делегирования (то есть событие должно быть навешано на ul).
Решение:
<ul id="ul">
<li>пункт 1</li>
<li>пункт 2</li>
<li>пункт 3</li>
</ul>
<button id="btn">Добавить li</button>
var ul = document.getElementById('ul');
ul.addEventListener('click', addSign);
function addSign() {
event.target.innerHTML = event.target.innerHTML + '!';
}
var button = document.getElementById('btn');
button.addEventListener('click', addLi);
function addLi() {
var li = document.createElement('li');
li.innerHTML = 'пункт';
ul.appendChild(li);
}
Дана таблица с юзерами с двумя колонками: имя и фамилия. Под таблицей сделайте форму, с помощью которой можно будет добавить нового юзера в таблицу. Сделайте так, чтобы при клике на любую ячейку появлялся prompt, с помощью которого можно изменить текст ячейки. Задачу решите с помощью делегирования (то есть событие должно быть навешано на table).