'use strict';
import htmlObj from './someTree.js';

//Домашнее задание  DOM2
//Еще дз: переписать подсветку таблицы используя минимум this.* и максимум
//переменных замыкания. Для этого Надо занести обработчики событий во вложенный for

const table = document.createElement('table');

for (let i = 0; i < 10; i++) {
	const tr = document.createElement('tr');
	const handleLightTr = function (td, className) {
		Object.values(table.children).forEach((el) => {
			Object.values(el.children).forEach(
				(td) => (td.style.backgroundColor = tr === el ? 'yellow' : 'grey')
			);
		});
		const trColl = document.getElementsByClassName(className);
		Object.values(trColl).forEach(
			(tr) => (tr.style.backgroundColor = 'orange')
		);
		td.style.backgroundColor = 'green';
	};
	for (let j = 1; j < 11; j++) {
		const td = document.createElement('td');
		td.addEventListener('mousemove', () =>
			handleLightTr(td, j === 10 ? 10 : j)
		);
		td.classList.add(j === 10 ? 10 : j);
		if (j === 10) {
			td.textContent = String(i);
			tr.prepend(td);
			continue;
		}
		td.textContent = String((i === 0 ? 1 : i) * j);
		tr.append(td);
	}
	table.append(tr);
}

document.body.append(table);