Jósló weboldal JavaScript-en

Most készítünk egy weboldalt, amely jóslatokat fog kiadni. Legyen ezen az oldalon egy gomb, amelyre kattintva elindul egy időzítő, amely minden 0.1 másodpercben kiír valamilyen div-be egy véletlen számot 1-től egy bizonyos maximumig.

A div alatt legyen egy másik gomb, amelyre kattintva az oldalunk felhasználója leállíthatja az időzítőt és rögzíthet egy bizonyos számot a div-ben. Ez a szám lesz a jóslat sorszáma. Ezután mutassa meg a felhasználónak a jóslatot ezzel a sorszámmal, és minden felesleges gombot távolítson el a képernyőről, hogy a felhasználó ne tudjon még egy jóslatot kapni. Vagyis egy látogatásra az oldalon - egy jóslat.

Itt egy minta arról, hogy mi kell, hogy kijöjjön:

Itt a HTML és CSS, amelyet használhatsz a feladat megoldásánál:

<div id="parent">
	<div id="timer">?</div>
	<div id="text"></div>
	<button id="start" class="active">add meg a sorsod</button>
	<button id="stop">add meg a jóslatot</button>
</div>

#parent {
	text-align: center;
}
#parent > * {
	margin-bottom: 10px;
}

#timer {
	font-size: 18px;
}
#text {
	font-size: 17px;
	font-style: italic;
}

button {
	padding: 5px 10px;
	font-size: 15px;
	cursor: pointer;
}
button:not(.active) {
	display: none;
}

Gondold át, hogyan lenne kényelmes tárolni a jóslatokat.

Valósítsd meg a leírt weboldalt.

Legyenek a jóslatok két fajtájúak: jók és rosszak. Állítsd be, hogy a rosszak pirosra színeződjenek, a jók - zöldre.