JSFiddle - React, Tailwind, and code Playground
by Josh Pullen
HTML
<span id="a"></span>
-
<span id="b"></span>
=
<input id="answer" type="number" />
<button id="submit">Check answer</button>
JavaScript
function generate() {
const a = Math.floor(Math.random() * 10)
const b = Math.floor(Math.random() * 10)
return { a, b }
}
function check(question, answer) {
return answer === question.a - question.b
}
///////////////////////////////////////////////////
const question = generate()
document.querySelector("#a").innerText = question.a
document.querySelector("#b").innerText = question.b
document.querySelector("#submit").addEventListener("click", function() {
const answer = Number(document.querySelector("#answer").value)
if (check(question, answer)) {
alert("Correct!")
} else {
alert("Wrong.")
}
})