javascriptで設定日時になったら消したり出したり
複数設定も行ける
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 | <script>/** * HTMLエレメント内に書かれたdata属性の日付に従い、 * コンテンツを表示・非表示処理する。 */window.onload = () => { const elements = document.querySelectorAll('.js-timer'); elements.forEach((el) => { const now = new Date().getTime(); const start = new Date(el.dataset.start).getTime(); const end = new Date(el.dataset.end).getTime(); let flag = false; // Global Flag /** * 現在が開始日以降か判定 * * @return Boolean; */ const checkerStart = () => { if (now > start) { return true; } else { return false; } }; /** * 現在が終了日以前か判定 * * @return Boolean; */ const checkerEnd = () => { if (now < end) { return true; } else { return false; } }; /* * メイン判定処理 */ if (start && end) { if (checkerStart() && checkerEnd()) flag = true; } else if (start && !end) { if (checkerStart()) flag = true; } else if (!start && end) { if (checkerEnd()) flag = true; } else { flag = false; } if (!flag) el.setAttribute('style', 'display: none;'); });};</script><span class="js-timer" data-end="2022/09/25 01:27"><div class="button1"><a href="#">9.25 1:27に消えます</a></div></span><span class="js-timer" data-end="2022/09/26 13:00"><div class="button1"><a href="#">9.26 13:00に消えます</a></div></span> |