Untitled

<html lang="pl">
<head>
<meta charset="UTF-8">
<title>JavaScript dla początkujących – przykłady szkoleniowe</title>
<link rel="stylesheet" href="style.css">
</head>
<body>


<h1>JavaScript dla początkujących – wszystkie przykłady</h1>
<p>Dokument zawiera cały kod wykorzystywany podczas lekcji.</p>


<hr>


<h2>1. Pierwszy skrypt: alert</h2>
<p>Po otwarciu strony pojawi się małe okno powitalne.</p>


<hr>


<h2>2. Zmienne w JavaScript – wynik w konsoli</h2>
<p>Aby zobaczyć wynik, wciśnij F12 → Console.</p>


<hr>


<h2>3. Zdarzenia: zmiana tekstu po kliknięciu</h2>
<button id="btn1">Kliknij mnie</button>
<p id="tekst1">Czekam na kliknięcie...</p>


<hr>


<h2>4. Prosta animacja – zmiana koloru kwadratu</h2>
<div id="box"></div>


<hr>


<h2>5. Mini projekt: Quiz</h2>
<h3>Pytanie: Ile to jest 2 + 2?</h3>
<input id="odp1" type="text" placeholder="Wpisz odpowiedź">
<button id="sprawdz1">Sprawdź</button>
<p id="wynik1"></p>


<hr>


<h2>6. Mini projekt: Blog / gazetka klasowa</h2>
<p>Dodaj swój wpis:</p>
<input id="tekstBlog" type="text" placeholder="Wpis...">
<button id="dodajBlog">Dodaj wpis</button>
<ul id="listaBlog"></ul>


<hr>


<h2>7. Dodatkowe narzędzia interaktywne</h2>


<h3>Zmiana koloru tła strony</h3>
<button id="kolorTlo">Zmień tło</button>


<h3>Licznik kliknięć</h3>
<button id="klikBtn">Kliknij mnie</button>
<p>Liczba kliknięć: <span id="licznik">0</span></p>


<hr>


<h2>Koniec dokumentu</h2>
<p>To są wszystkie przykłady z lekcji. Możesz je modyfikować i rozwijać.</p>


<script src="script.js"></script>
</body>
</html>