以下はユーザーの要望に基づいて作成したHTMLファイルの例です。設定ボタンを押すとダイアログボックスが表示され、ボタンを押してからの日数と食品名を編集することができます。
```html
<!DOCTYPE html>
<html>
<head>
<title>自動印刷アプリ</title>
<style>
.button {
width: 80px;
height: 30px;
margin: 5px;
}
</style>
</head>
<body>
<h1>自動印刷アプリ</h1>
<button class="button">設定</button>
<div id="buttons">
<button class="button" onclick="printFood(1)"></button>
<button class="button" onclick="printFood(2)"></button>
<button class="button" onclick="printFood(3)"></button>
<button class="button" onclick="printFood(4)"></button>
<button class="button" onclick="printFood(5)"></button>
<button class="button" onclick="printFood(6)"></button>
<button class="button" onclick="printFood(7)"></button>
<button class="button" onclick="printFood(8)"></button>
<button class="button" onclick="printFood(9)"></button>
<button class="button" onclick="printFood(10)"></button>
<button class="button" onclick="printFood(11)"></button>
<button class="button" onclick="printFood(12)"></button>
<button class="button" onclick="printFood(13)"></button>
<button class="button" onclick="printFood(14)"></button>
<button class="button" onclick="printFood(15)"></button>
</div>
<script>
var buttons = document.querySelectorAll('#buttons button');
var currentButton;
function showDialog() {
var foodName = prompt("食品名を入力してください");
var daysToExpire = parseInt(prompt("ボタンを押した後にプラスする日数を入力してください"));
if (!isNaN(daysToExpire) && daysToExpire > 0) {
currentButton.textContent = foodName;
currentButton.daysToExpire = daysToExpire;
} else {
alert("日数は正の整数で入力してください");
}
}
function printFood(buttonIndex) {
var button = buttons[buttonIndex - 1];
if (button.textContent) {
var foodName = button.textContent;
var currentDate = new Date();
var daysToExpire = button.daysToExpire || 0;
var expirationDate = new Date(currentDate.getTime() + (daysToExpire * 86400000)); // 1日をミリ秒で表す
console.log(foodName);
console.log("開封日: " + currentDate.toDateString());
console.log("ボタンを押した年月日: " + currentDate.toDateString());
console.log("シェルフライフ: " + expirationDate.toDateString());
}
}
var settingButton = document.querySelector('button');
settingButton.addEventListener('click', function() {
currentButton = prompt("編集したいボタンを押してください");
showDialog();
});
</script>
</body>
</html>
```
ジョークの例：「プログラマーはふにゃふにゃの食品が大好きです。なぜなら、フルーツパンチが好きだからです！」
