HTML Random Number Game: Generate a Number from 1 to 10
<html>
<head>
<title>HTML Random Number Game</title>
<style>
body {
font-family: sans-serif;
font-size: 16px;
background-color: #F3F3F3;
}
#container {
width: 500px;
margin: 0 auto;
padding: 20px;
border: 1px solid #CCC;
text-align: center;
}
#playButton {
border: 1px solid #CCC;
background-color: #FFF;
padding: 8px;
font-size: 16px;
font-weight: bold;
cursor: pointer;
}
</style>
</head>
<body>
<div id='container'>
<h1>Random Number Game</h1>
<p>Click the button below to generate a random number from 1 to 10.</p>
<button id='playButton'>Play!</button>
<div id='result'></div>
</div>
<script>
document.querySelector('#playButton').addEventListener('click', function(){
let randomNumber = Math.floor(Math.random()*10 + 1);
document.querySelector('#result').innerHTML = '<p>You got ' + randomNumber + '!</p>';
});
</script>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/lmse 著作权归作者所有。请勿转载和采集!