Voorspellingssite op JavaScript

Nu gaan we een website maken die voorspellingen geeft. Laat er op deze website een knop zijn, waarop wanneer geklikt wordt een timer start, die elke 0.1 seconde een willekeurig getal van 1 tot een bepaalde maximumwaarde in een div weergeeft.

Onder de div laat er een andere knop zijn, waarop wanneer geklikt wordt de gebruiker van onze site de timer kan stoppen en een bepaald getal in de div kan vastleggen. Dit getal wordt het voorspellingsnummer. Daarna toont u de gebruiker de voorspelling met dit nummer, en verwijdert u alle overige knoppen van het scherm, zodat de gebruiker niet nog een voorspelling kan krijgen. Dus per sessie op de site - één voorspelling.

Hier is een voorbeeld van wat het resultaat moet zijn:

Hier is de opmaak die u kunt gebruiken bij het oplossen van de taak:

<div id="parent">
	<div id="timer">?</div>
	<div id="text"></div>
	<button id="start" class="active">ontdek je lot</button>
	<button id="stop">krijg voorspelling</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;
}

Bedenk hoe het handig is om de voorspellingen op te slaan.

Implementeer de beschreven website.

Zorg ervoor dat de voorspellingen van twee soorten zijn: goede en slechte. Zorg ervoor dat slechte voorspellingen in rood worden gekleurd, en goede - in groen.