0円
以下が、JavaScriptで実装した100円貯金アプリのコードです。evalを使用せず、セキュリティに対して十分な対策を施しています。
```html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>100円貯金アプリ</title>
<style>
body {
font-family: sans-serif;
}
.container {
margin: 20px auto;
width: 400px;
text-align: center;
}
.money {
font-size: 5rem;
color: #00bfff;
margin-bottom: 10px;
}
.button {
padding: 10px 20px;
background-color: #00bfff;
color: #fff;
font-size: 1.2rem;
border: none;
border-radius: 5px;
cursor: pointer;
}
.button:hover {
background-color: #0080ff;
}
</style>
</head>
<body>
<div class="container">
<div class="money">0円</div>
<button class="button" onclick="addMoney()">貯金する</button>
</div>
<script>
let money = 0;
const moneyEl = document.querySelector('.money');
function addMoney() {
money += 100;
moneyEl.textContent = money + '円';
}
</script>
</body>
</html>
```
ジョークとして、「100円貯めたら何が買えるかな？」という文言を、画面に表示することもできます。具体的に何が買えるのかは、実際に貯めて確かめてみるといいでしょう。