|
|
@@ -0,0 +1,63 @@
|
|
|
+// // Таблица умножения + Подсветить ячейку
|
|
|
+// let table = document.createElement('table');
|
|
|
+// for (let i = 1; i < 10; i++) {
|
|
|
+// let row = document.createElement('tr')
|
|
|
+// for (let j = 1; j < 10; j++) {
|
|
|
+// let td = document.createElement('td')
|
|
|
+// td.onmouseover = function () {
|
|
|
+// this.style.backgroundColor = 'red'
|
|
|
+// }
|
|
|
+// td.onmouseout = function () {
|
|
|
+// this.style.backgroundColor = 'white'
|
|
|
+// if (i % 2 !== 0) { this.style.backgroundColor = '#e9e9e9' }
|
|
|
+// else { this.style.backgroundColor = 'white'; }
|
|
|
+// }
|
|
|
+// if (i % 2 !== 0) { td.style.backgroundColor = '#e9e9e9' }
|
|
|
+// td.innerText = j * i
|
|
|
+// td.style.border = '1px solid #d3d3d3'
|
|
|
+// td.style.padding = '10px'
|
|
|
+// td.style.fontSize = '20px'
|
|
|
+// td.style.textAlign = 'center'
|
|
|
+// row.appendChild(td)
|
|
|
+// }
|
|
|
+// table.appendChild(row)
|
|
|
+// }
|
|
|
+// document.body.appendChild(table)
|
|
|
+
|
|
|
+
|
|
|
+// Подсветить строку и столбец
|
|
|
+let table = document.createElement('table');
|
|
|
+for (let i = 1; i < 10; i++) {
|
|
|
+ let row = document.createElement('tr')
|
|
|
+ for (let j = 1; j < 10; j++) {
|
|
|
+ let td = document.createElement('td')
|
|
|
+ td.onmouseover = function () {
|
|
|
+ this.parentElement.style.backgroundColor = 'yellow'
|
|
|
+ let index = this.cellIndex;
|
|
|
+ let col = document.querySelectorAll('tr');
|
|
|
+ col.forEach((row) => row.children[index].style.backgroundColor = 'yellow');
|
|
|
+ this.style.backgroundColor = 'red';
|
|
|
+ }
|
|
|
+ td.onmouseout = function () {
|
|
|
+ this.style.backgroundColor = 'white'
|
|
|
+ this.parentElement.style.backgroundColor = ''
|
|
|
+ let index = this.cellIndex;
|
|
|
+ let col = document.querySelectorAll('tr');
|
|
|
+ col.forEach((row) => row.children[index].style.backgroundColor = '');
|
|
|
+ }
|
|
|
+ td.innerText = j * i
|
|
|
+ td.style.border = '1px solid #d3d3d3'
|
|
|
+ td.style.padding = '10px'
|
|
|
+ td.style.fontSize = '20px'
|
|
|
+ td.style.textAlign = 'center'
|
|
|
+ row.appendChild(td)
|
|
|
+ }
|
|
|
+ table.appendChild(row)
|
|
|
+}
|
|
|
+document.body.appendChild(table)
|
|
|
+
|
|
|
+// Calc
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
