Saper prawie skończony, zostało tylko odkrycie wszystkich pól po przegranej/wygranej

Lekcja_05/codeshare_zdarzenia.md

@@ -0,0 +1,69 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <script>
+        function zmiana(d) {
+            d.innerText = "Szymek";
+        }
+
+        function init() {
+            const els = document.getElementsByTagName("button");
+            console.log(els);
+            for (let i = 0; i < els.length; i++) {
+                // els[i].onclick = function () {
+                //     console.log("click", this);
+                // }
+
+                els[i].onclick = (e) => {
+                    console.log("click", this, e, e.target);
+                    e.target.style.backgroundColor = "pink"
+                }
+
+                //els[i].onclick = function () {
+                //    console.log("test");
+                //}
+                // nadpisuje tego samego typu zdarzenie
+            }
+
+            // Listenery
+            const inner = document.getElementById("inner");
+            inner.addEventListener("click", function (e) {
+                console.log("INNER1", e)
+                e.stopPropagation();
+            }, false);
+
+            const outer = document.getElementById("outer");
+            outer.addEventListener("click", function () {
+                console.log("OUTER")
+
+            }, false); // true/false event capturing bubbling
+
+            // inner.addEventListener("click", function () {
+            //     console.log("INNER2")
+            // }, false);
+            // zdarzenie sie "dopisuje"
+            // removeEventListener
+        }
+    </script>
+</head>
+
+<body onload="init();" oncontextmenu="console.log('menu');event.preventDefault();">
+    <!--
+    <button onclick="console.log('click',this);zmiana(this)" onmouseover="console.log('over')">A</button>
+    <button onclick="console.log('click',this);zmiana(this)">B</button>
+    <button onclick="console.log('click',this);zmiana(this)">C</button>
+-->
+    <button>A</button>
+    <button>B</button>
+    <button>C</button>
+
+    <div id="outer">OUTER
+        <div id="inner">INNER</div>
+    </div>
+</body>
+
+</html>