hw.js 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. 'use strict';
  2. import htmlObj from './someTree.js';
  3. //Домашнее задание DOM2
  4. //Еще дз: переписать подсветку таблицы используя минимум this.* и максимум
  5. //переменных замыкания. Для этого Надо занести обработчики событий во вложенный for
  6. const table = document.createElement('table');
  7. for (let i = 0; i < 10; i++) {
  8. const tr = document.createElement('tr');
  9. const handleLightTr = function (td, className) {
  10. Object.values(table.children).forEach((el) => {
  11. Object.values(el.children).forEach(
  12. (td) => (td.style.backgroundColor = tr === el ? 'yellow' : 'grey')
  13. );
  14. });
  15. const trColl = document.getElementsByClassName(className);
  16. Object.values(trColl).forEach(
  17. (tr) => (tr.style.backgroundColor = 'orange')
  18. );
  19. td.style.backgroundColor = 'green';
  20. };
  21. for (let j = 1; j < 11; j++) {
  22. const td = document.createElement('td');
  23. td.addEventListener('mousemove', () =>
  24. handleLightTr(td, j === 10 ? 10 : j)
  25. );
  26. td.classList.add(j === 10 ? 10 : j);
  27. if (j === 10) {
  28. td.textContent = String(i);
  29. tr.prepend(td);
  30. continue;
  31. }
  32. td.textContent = String((i === 0 ? 1 : i) * j);
  33. tr.append(td);
  34. }
  35. table.append(tr);
  36. }
  37. document.body.append(table);