HTML 实现超有趣射击游戏：点击目标赢高分！

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Shoot the Target Game</title> <style> body { display: flex; justify-content: center; align-items: center; height: 100vh; background-color: #f0f0f0; } #target { width: 50px; height: 50px; background-color: red; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); cursor: pointer; } </style> </head> <body> <div id="target"></div> <script> const target = document.getElementById('target'); const body = document.querySelector('body'); let score = 0; target.addEventListener('click', () => { score++; target.style.top = `${Math.random() * 80}vh`; target.style.left = `${Math.random() * 80}vw`; }); body.addEventListener('click', () => { alert(`Your score: ${score}`); score = 0; }); </script> </body> </html> ######[AI写代码神器 | 757点数解答 | 2024-11-08 11:22:30]

服务商

更多选项

快捷项

自定义

HTML 实现超有趣射击游戏：点击目标赢高分！