This page will generate a random playing card and display it at the top of the page.
The card will refresh each time the page is reloaded, providing a new random draw.
<html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Random Card Draw</title> <style> #randomCard { font-size: 48px; font-weight: bold; text-align: center; margin: 20px 0; } </style> </head> <body> <div id="randomCard"></div> <script> function getRandomCard() { const suits = ['♠', '♥', '♦', '♣']; const values = ['A', '2', '3', '4', '5', '6', '7', '8', '9', '10', 'J', 'Q', 'K']; const randomSuit = suits[Math.floor(Math.random() * suits.length)]; const randomValue = values[Math.floor(Math.random() * values.length)]; return `${randomValue}${randomSuit}`; } document.getElementById('randomCard').textContent = getRandomCard(); window.addEventListener('beforeunload', function() { localStorage.setItem('lastCardDrawn', document.getElementById('randomCard').textContent); }); window.addEventListener('load', function() { const lastCard = localStorage.getItem('lastCardDrawn'); if (lastCard) { document.getElementById('randomCard').textContent = getRandomCard(); } }); </script> </body> </html>