|
|
@@ -0,0 +1,102 @@
|
|
|
+//Таблица умножения
|
|
|
+// let table = document.createElement('table');
|
|
|
+// table.classList.add('bord');
|
|
|
+// for (let r = 0; r < 10; r++){
|
|
|
+// let row = document.createElement('tr');
|
|
|
+// for(let c = 0; c < 10; c++){
|
|
|
+// let cell = document.createElement('td');
|
|
|
+// cell.classList.add('cell');
|
|
|
+// let val = r * c;
|
|
|
+// if(val === 0){
|
|
|
+// val = r || c;
|
|
|
+// }
|
|
|
+// cell.innerHTML = val;
|
|
|
+// row.appendChild(cell);
|
|
|
+// }
|
|
|
+// table.appendChild(row);
|
|
|
+// }
|
|
|
+// document.body.appendChild(table);
|
|
|
+// console.log(table);
|
|
|
+
|
|
|
+//Подсветить ячейку
|
|
|
+// let td = document.querySelectorAll('td');
|
|
|
+
|
|
|
+// td.forEach((i) => {
|
|
|
+// i.onmouseover = () => i.style.backgroundColor = 'blue';
|
|
|
+// i.onmouseout = () => i.style.backgroundColor = '';
|
|
|
+// });
|
|
|
+
|
|
|
+//Подсветить строку и столбец
|
|
|
+// let tr = document.querySelectorAll('tr');
|
|
|
+
|
|
|
+// td.forEach((item, i) => {
|
|
|
+// item.onmouseover = (e) => {
|
|
|
+// let column = Array.from(item.parentElement.parentElement.children);
|
|
|
+// column.forEach((el, i) => {
|
|
|
+// if (el.children[i].cellIndex === item.cellIndex) {
|
|
|
+// Array.from(el.parentElement.children).forEach(elem => elem.children[i].style.backgroundColor = 'blue');
|
|
|
+// }
|
|
|
+// });
|
|
|
+// };
|
|
|
+// item.onmouseout = () => {
|
|
|
+// let column = Array.from(item.parentElement.parentElement.children);
|
|
|
+// column.forEach((el, i) => {
|
|
|
+// if (el.children[i].cellIndex === item.cellIndex) {
|
|
|
+// Array.from(el.parentElement.children).forEach(elem => elem.children[i].style.backgroundColor = '');
|
|
|
+// }
|
|
|
+// });
|
|
|
+// };
|
|
|
+// });
|
|
|
+
|
|
|
+// tr.forEach((item, i) => {
|
|
|
+// item.onmouseover = (e) => {
|
|
|
+// let rows = Array.from(item.children);
|
|
|
+// rows.forEach((el, i) => {
|
|
|
+// el.style.backgroundColor = 'blue';
|
|
|
+// });
|
|
|
+// };
|
|
|
+// item.onmouseout = () => {
|
|
|
+// let rows = Array.from(item.children);
|
|
|
+// rows.forEach((el, i) => {
|
|
|
+// el.style.backgroundColor = '';
|
|
|
+// });
|
|
|
+// };
|
|
|
+// });
|
|
|
+
|
|
|
+//Calc
|
|
|
+let input1 = document.createElement('input');
|
|
|
+input1.id = 'input1';
|
|
|
+input1.type = 'number';
|
|
|
+document.body.appendChild(input1);
|
|
|
+
|
|
|
+let p1 = document.createElement('p');
|
|
|
+p1.innerHTML = '+';
|
|
|
+document.body.appendChild(p1);
|
|
|
+
|
|
|
+let input2 = document.createElement('input');
|
|
|
+input2.id = 'input2';
|
|
|
+input2.type = 'number';
|
|
|
+document.body.appendChild(input2);
|
|
|
+
|
|
|
+let p2 = document.createElement('p');
|
|
|
+p2.innerHTML = '=';
|
|
|
+document.body.appendChild(p2);
|
|
|
+
|
|
|
+let btn = document.createElement('button');
|
|
|
+btn.id = 'btn';
|
|
|
+btn.innerHTML = 'sum';
|
|
|
+document.body.appendChild(btn);
|
|
|
+
|
|
|
+btn.onclick = function () {
|
|
|
+ ((+input1.value) + (+input2.value));
|
|
|
+};
|
|
|
+
|
|
|
+//Calc Live
|
|
|
+let pRes = document.createElement('p');
|
|
|
+function calc () {
|
|
|
+ pRes.id = 'result';
|
|
|
+ pRes.innerHTML = `Sum = ${((+input1.value) + (+input2.value))}`;
|
|
|
+ document.body.appendChild(pRes);
|
|
|
+}
|
|
|
+input1.oninput = calc;
|
|
|
+input2.oninput = calc;
|
