ALevel_HW6

ALevel_HW6 DOM: ДЗ Таблица умножения Сделать таблицу умножения, используя DOM createElement и innerText. Создайте таблицу, вложенные строки и ячейки в циклах. Должно получится что-то вроде этого:

Подсветить ячейку над которой находится курсор мыши. Используйте события mouseover и mouseout, и style.backgroundColor для подсветки. Читкоды: в обработчик события в качестве this передается элемент, на котором событие произошло; td.onmouseover = function(event){ console.log(this, event) //event - это объект с информацией о событии, //передается первым параметром в обработчик события. } Внимание: :hover это читерство :-) Подсветить строку и столбец, в которой находится подсвеченная ячейка. Используйте parentElement (родительский элемент элемента DOM), и список его детей: children. Читкоды: в обработчик события в качестве this передается элемент, на котором событие произошло; у td есть свойство cellIndex, в котором лежит номер ячейки; у tr, аналогично есть свойство rowIndex - номер строки; Calc Сделайте ваш калькулятор из первых занятий используя DOM и элементы input (в т. ч. type="number" для чисел) Каждому полю ввода присвойте тот или иной id для обращения в обрабочтике события. Для запуска раcчета используйте, например и calc.onclick = function(){ alert((+someIdOfInput1.value) + (+someIdOfInput2.value)) //просуммировали два поля ввода с id someIdOfInput1 и someIdOfInput2 } Также можете создать поле ввода для результата и записывать результат в value этого поля. Calc Live Сделайте расчет живым, т. е. обновляющимся по событию oninput каждого поля ввода, влияющего на результат. Нет смысла копировать одну и ту же калькуляцию, поэтому вначале задекларируйте функцию расчета, а потом присвойте её в качестве обработчика события в каждом поле ввода: function calc() { result.value = (+input1.value) + (+input2.value) }

input1.oninput = calc input2.oninput = calc