|
|
@@ -24,7 +24,7 @@
|
|
|
|
|
|
|
|
|
// Подсветить строку и столбец
|
|
|
-let table = document.createElement('table');
|
|
|
+let table = document.getElementById('table');
|
|
|
for (let i = 1; i < 10; i++) {
|
|
|
let row = document.createElement('tr')
|
|
|
for (let j = 1; j < 10; j++) {
|
|
|
@@ -32,7 +32,7 @@ for (let i = 1; i < 10; i++) {
|
|
|
td.onmouseover = function () {
|
|
|
this.parentElement.style.backgroundColor = 'yellow'
|
|
|
let index = this.cellIndex;
|
|
|
- let col = document.querySelectorAll('tr');
|
|
|
+ let col = document.querySelectorAll('#table > tr');
|
|
|
col.forEach((row) => row.children[index].style.backgroundColor = 'yellow');
|
|
|
this.style.backgroundColor = 'red';
|
|
|
}
|
|
|
@@ -40,7 +40,7 @@ for (let i = 1; i < 10; i++) {
|
|
|
this.style.backgroundColor = 'white'
|
|
|
this.parentElement.style.backgroundColor = ''
|
|
|
let index = this.cellIndex;
|
|
|
- let col = document.querySelectorAll('tr');
|
|
|
+ let col = document.querySelectorAll('#table > tr');
|
|
|
col.forEach((row) => row.children[index].style.backgroundColor = '');
|
|
|
}
|
|
|
td.innerText = j * i
|
|
|
@@ -54,6 +54,36 @@ for (let i = 1; i < 10; i++) {
|
|
|
}
|
|
|
document.body.appendChild(table)
|
|
|
|
|
|
+let secondtable = document.getElementById('table1');
|
|
|
+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('#table1 > 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('#table1 > 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)
|
|
|
+ }
|
|
|
+ secondtable.appendChild(row)
|
|
|
+}
|
|
|
+document.body.appendChild(secondtable)
|
|
|
+
|
|
|
// Calc
|
|
|
// let calc = document.getElementById("calc");
|
|
|
// let input1 = document.getElementById("input1");
|
