vladislavaSim пре 2 година
родитељ
комит
609e5bd0b6
2 измењених фајлова са 68 додато и 0 уклоњено
  1. 20 0
      HW7/index.html
  2. 48 0
      HW7/main.js

+ 20 - 0
HW7/index.html

@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>HW7</title>
+    <style>
+        table td {
+            padding: 5px;
+            border: 1px solid grey;
+        }
+    </style>
+</head>
+<body>
+    <input type="number" id="n1">
+    <input type="number" id="n2">
+    <button id="calcBtn">sum</button>
+    <div id="result"></div>
+<script src="main.js"></script>
+</body>
+</html>

+ 48 - 0
HW7/main.js

@@ -0,0 +1,48 @@
+let $table = document.createElement('table');
+
+for(let i = 1; i < 10; i++) {
+    let $tr = document.createElement('tr')
+    for(let j = 1; j < 10; j++) {
+        let $td = document.createElement('td')
+        $td.innerText = String(j * i)
+        $td.onmouseover = (e) => {
+           Array.from($table.children).map(item => {
+            Array.from(item.children).filter(item => item.cellIndex === e.target.cellIndex).map(item => item.style.backgroundColor = 'red')
+        })
+            $td.style.backgroundColor = 'green'
+        }
+        $td.onmouseout = (e) => {
+            Array.from($table.children).map(item => {
+                Array.from(item.children).filter(item => item.cellIndex === e.target.cellIndex).map(item => item.style.backgroundColor = 'white')
+            })
+        }
+        $tr.appendChild($td)
+    }
+    $table.appendChild($tr)
+}
+document.body.appendChild($table)
+
+const $n1 = document.querySelector('#n1')
+const $n2 = document.querySelector('#n2')
+const $calcBtn = document.querySelector('#calcBtn')
+const $result = document.querySelector('#result')
+
+const calcSum = () => {
+    return $result.innerText = String(+$n1.value + +$n2.value)
+}
+
+$calcBtn.addEventListener( 'click',  () => {
+    calcSum()
+})
+$n1.onchange = calcSum()
+$n2.onchange = calcSum()
+$calcBtn.onclick = calcSum()
+
+
+
+
+
+
+
+
+