\u0e40\u0e01\u0e21\u0e04\u0e13\u0e34\u0e15\u0e28\u0e32\u0e2a\u0e15\u0e23\u0e4c \u0e1b.3: \u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e2b\u0e32\u0e23\u0e40\u0e25\u0e02<\/title>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Kanit:wght@400;700&display=swap\" rel=\"stylesheet\">\n <style>\n body {\n font-family: 'Kanit', sans-serif;\n background-color: #0f0c29;\n background-image: linear-gradient(315deg, #0f0c29 0%, #302b63 74%, #24243e 100%);\n color: white;\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 100vh;\n margin: 0;\n overflow: hidden;\n }\n\n \/* \u0e2a\u0e23\u0e49\u0e32\u0e07\u0e14\u0e32\u0e27\u0e27\u0e34\u0e1a\u0e27\u0e31\u0e1a\u0e43\u0e19\u0e1e\u0e37\u0e49\u0e19\u0e2b\u0e25\u0e31\u0e07 *\/\n .stars {\n position: absolute;\n top: 0; left: 0; width: 100%; height: 100%;\n pointer-events: none;\n background-image: \n radial-gradient(white, rgba(255,255,255,.2) 2px, transparent 3px),\n radial-gradient(white, rgba(255,255,255,.15) 1px, transparent 2px),\n radial-gradient(white, rgba(255,255,255,.1) 2px, transparent 3px);\n background-size: 550px 550px, 350px 350px, 250px 250px;\n background-position: 0 0, 40px 60px, 130px 270px;\n }\n\n .game-container {\n background: rgba(255, 255, 255, 0.1);\n backdrop-filter: blur(10px);\n padding: 40px;\n border-radius: 20px;\n border: 2px solid rgba(255, 255, 255, 0.2);\n box-shadow: 0 0 20px rgba(0, 255, 255, 0.5);\n text-align: center;\n width: 90%;\n max-width: 500px;\n position: relative;\n z-index: 10;\n }\n\n h1 {\n margin: 0 0 20px;\n font-size: 2rem;\n color: #00ffff; \/* \u0e2a\u0e35\u0e1f\u0e49\u0e32\u0e19\u0e35\u0e2d\u0e2d\u0e19 *\/\n text-shadow: 0 0 10px #00ffff;\n }\n\n .score-panel {\n font-size: 1.2rem;\n margin-bottom: 20px;\n display: flex;\n justify-content: space-between;\n padding: 10px 20px;\n background: rgba(0, 0, 0, 0.3);\n border-radius: 10px;\n }\n\n .question-box {\n font-size: 4rem;\n font-weight: bold;\n margin: 20px 0;\n color: #fff;\n text-shadow: 2px 2px 0px #ff00de; \/* \u0e40\u0e07\u0e32\u0e2a\u0e35\u0e0a\u0e21\u0e1e\u0e39 *\/\n animation: float 3s ease-in-out infinite;\n }\n\n @keyframes float {\n 0% { transform: translateY(0px); }\n 50% { transform: translateY(-10px); }\n 100% { transform: translateY(0px); }\n }\n\n .options-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 15px;\n margin-top: 20px;\n }\n\n .option-btn {\n background: linear-gradient(45deg, #ff0099, #493240);\n border: none;\n border-radius: 15px;\n padding: 20px;\n font-size: 2rem;\n color: white;\n font-family: 'Kanit', sans-serif;\n font-weight: bold;\n cursor: pointer;\n transition: transform 0.1s, box-shadow 0.2s;\n box-shadow: 0 5px 0 #96005a;\n }\n\n .option-btn:active {\n transform: translateY(4px);\n box-shadow: 0 1px 0 #96005a;\n }\n\n .option-btn:hover {\n filter: brightness(1.2);\n }\n\n .option-btn.correct {\n background: linear-gradient(45deg, #00b09b, #96c93d) !important;\n box-shadow: 0 5px 0 #00685b !important;\n }\n\n .option-btn.wrong {\n background: linear-gradient(45deg, #ff416c, #ff4b2b) !important;\n box-shadow: 0 5px 0 #a60000 !important;\n opacity: 0.6;\n }\n\n .btn-next {\n margin-top: 25px;\n padding: 10px 30px;\n font-size: 1.5rem;\n background-color: #fff;\n color: #333;\n border: none;\n border-radius: 50px;\n cursor: pointer;\n font-family: 'Kanit', sans-serif;\n font-weight: bold;\n box-shadow: 0 0 15px white;\n }\n \n .hidden { display: none; }\n\n .mascot {\n font-size: 3rem;\n margin-bottom: 10px;\n }\n <\/style>\n<\/head>\n<body>\n\n <div class=\"stars\"><\/div>\n\n <div class=\"game-container\">\n <div id=\"game-screen\">\n <div class=\"mascot\">\ud83d\ude80<\/div>\n <h1>\u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e2b\u0e32\u0e23\u0e40\u0e25\u0e02<\/h1>\n \n <div class=\"score-panel\">\n <span>\u0e02\u0e49\u0e2d\u0e17\u0e35\u0e48: <span id=\"q-number\">1<\/span>\/10<\/span>\n <span>\u0e04\u0e30\u0e41\u0e19\u0e19: <span id=\"score\">0<\/span><\/span>\n <\/div>\n\n <div class=\"question-box\" id=\"question-text\">\n Loading…\n <\/div>\n\n <div class=\"options-grid\" id=\"options-container\">\n <\/div>\n\n <button id=\"next-btn\" class=\"btn-next hidden\" onclick=\"generateQuestion()\">\u0e02\u0e49\u0e2d\u0e15\u0e48\u0e2d\u0e44\u0e1b \u2794<\/button>\n <div id=\"feedback-msg\" style=\"margin-top:10px; height: 24px;\"><\/div>\n <\/div>\n\n <div id=\"result-screen\" class=\"hidden\">\n <h1>\u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e2a\u0e33\u0e40\u0e23\u0e47\u0e08!<\/h1>\n <div style=\"font-size: 5rem;\">\ud83c\udf0e<\/div>\n <p style=\"font-size: 1.5rem;\">\u0e04\u0e30\u0e41\u0e19\u0e19\u0e23\u0e27\u0e21: <span id=\"final-score\"><\/span>\/10<\/p>\n <p id=\"cheer-msg\"><\/p>\n <button class=\"btn-next\" onclick=\"restartGame()\">\u0e40\u0e23\u0e34\u0e48\u0e21\u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e43\u0e2b\u0e21\u0e48 \u21ba<\/button>\n <\/div>\n <\/div>\n\n <script>\n let score = 0;\n let questionCount = 0;\n const totalQuestions = 10;\n \n const questionText = document.getElementById('question-text');\n const optionsContainer = document.getElementById('options-container');\n const nextBtn = document.getElementById('next-btn');\n const scoreDisplay = document.getElementById('score');\n const qNumDisplay = document.getElementById('q-number');\n const feedbackMsg = document.getElementById('feedback-msg');\n \n const gameScreen = document.getElementById('game-screen');\n const resultScreen = document.getElementById('result-screen');\n const finalScoreDisplay = document.getElementById('final-score');\n const cheerMsg = document.getElementById('cheer-msg');\n\n \/\/ \u0e40\u0e23\u0e34\u0e48\u0e21\u0e40\u0e01\u0e21\u0e04\u0e23\u0e31\u0e49\u0e07\u0e41\u0e23\u0e01\n startGame();\n\n function startGame() {\n score = 0;\n questionCount = 0;\n scoreDisplay.textContent = 0;\n gameScreen.classList.remove('hidden');\n resultScreen.classList.add('hidden');\n generateQuestion();\n }\n\n function generateQuestion() {\n \/\/ \u0e40\u0e0a\u0e47\u0e04\u0e27\u0e48\u0e32\u0e04\u0e23\u0e1a 10 \u0e02\u0e49\u0e2d\u0e2b\u0e23\u0e37\u0e2d\u0e22\u0e31\u0e07\n if (questionCount >= totalQuestions) {\n endGame();\n return;\n }\n\n questionCount++;\n qNumDisplay.textContent = questionCount;\n resetState();\n\n \/\/ --- Logic \u0e2a\u0e23\u0e49\u0e32\u0e07\u0e42\u0e08\u0e17\u0e22\u0e4c\u0e01\u0e32\u0e23\u0e2b\u0e32\u0e23 (\u0e25\u0e07\u0e15\u0e31\u0e27\u0e40\u0e2a\u0e21\u0e2d) ---\n \/\/ \u0e2a\u0e39\u0e15\u0e23: A \/ B = C\n \/\/ \u0e40\u0e23\u0e32\u0e08\u0e30\u0e2a\u0e38\u0e48\u0e21 B (\u0e15\u0e31\u0e27\u0e2b\u0e32\u0e23) \u0e41\u0e25\u0e30 C (\u0e04\u0e33\u0e15\u0e2d\u0e1a) \u0e01\u0e48\u0e2d\u0e19 \u0e41\u0e25\u0e49\u0e27\u0e04\u0e48\u0e2d\u0e22\u0e04\u0e39\u0e13\u0e01\u0e25\u0e31\u0e1a\u0e44\u0e1b\u0e2b\u0e32 A (\u0e15\u0e31\u0e27\u0e15\u0e31\u0e49\u0e07)\n \/\/ \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e43\u0e2b\u0e49\u0e21\u0e31\u0e48\u0e19\u0e43\u0e08\u0e27\u0e48\u0e32\u0e2b\u0e32\u0e23\u0e25\u0e07\u0e15\u0e31\u0e27\u0e41\u0e19\u0e48\u0e19\u0e2d\u0e19\n \n const divisor = Math.floor(Math.random() * 9) + 2; \/\/ \u0e2a\u0e38\u0e48\u0e21\u0e15\u0e31\u0e27\u0e2b\u0e32\u0e23 2 \u0e16\u0e36\u0e07 10\n const answer = Math.floor(Math.random() * 10) + 1; \/\/ \u0e2a\u0e38\u0e48\u0e21\u0e04\u0e33\u0e15\u0e2d\u0e1a 1 \u0e16\u0e36\u0e07 10\n const dividend = divisor * answer; \/\/ \u0e04\u0e33\u0e19\u0e27\u0e13\u0e15\u0e31\u0e27\u0e15\u0e31\u0e49\u0e07\n\n questionText.textContent = `${dividend} \u00f7 ${divisor} = ?`;\n\n \/\/ \u0e2a\u0e23\u0e49\u0e32\u0e07\u0e15\u0e31\u0e27\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e04\u0e33\u0e15\u0e2d\u0e1a 4 \u0e02\u0e49\u0e2d\n let options = new Set();\n options.add(answer); \/\/ \u0e43\u0e2a\u0e48\u0e04\u0e33\u0e15\u0e2d\u0e1a\u0e17\u0e35\u0e48\u0e16\u0e39\u0e01\u0e01\u0e48\u0e2d\u0e19\n\n \/\/ \u0e2a\u0e38\u0e48\u0e21\u0e15\u0e31\u0e27\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e2b\u0e25\u0e2d\u0e01 (\u0e44\u0e21\u0e48\u0e43\u0e2b\u0e49\u0e0b\u0e49\u0e33\u0e01\u0e31\u0e1a\u0e04\u0e33\u0e15\u0e2d\u0e1a\u0e08\u0e23\u0e34\u0e07)\n while(options.size < 4) {\n let wrongAnswer = Math.floor(Math.random() * 12) + 1;\n if (wrongAnswer !== answer) {\n options.add(wrongAnswer);\n }\n }\n\n \/\/ \u0e41\u0e1b\u0e25\u0e07 Set \u0e40\u0e1b\u0e47\u0e19 Array \u0e41\u0e25\u0e49\u0e27\u0e2a\u0e38\u0e48\u0e21\u0e25\u0e33\u0e14\u0e31\u0e1a\n const optionsArray = Array.from(options).sort(() => Math.random() - 0.5);\n\n \/\/ \u0e2a\u0e23\u0e49\u0e32\u0e07\u0e1b\u0e38\u0e48\u0e21\n optionsArray.forEach(opt => {\n const btn = document.createElement('button');\n btn.textContent = opt;\n btn.classList.add('option-btn');\n btn.onclick = () => checkAnswer(btn, opt, answer);\n optionsContainer.appendChild(btn);\n });\n }\n\n function resetState() {\n nextBtn.classList.add('hidden');\n feedbackMsg.textContent = \"\";\n while (optionsContainer.firstChild) {\n optionsContainer.removeChild(optionsContainer.firstChild);\n }\n }\n\n function checkAnswer(btn, selected, correct) {\n const buttons = optionsContainer.querySelectorAll('.option-btn');\n \n if (selected === correct) {\n btn.classList.add('correct');\n score++;\n scoreDisplay.textContent = score;\n feedbackMsg.textContent = \"\u0e16\u0e39\u0e01\u0e15\u0e49\u0e2d\u0e07\u0e04\u0e23\u0e31\u0e1a! \u0e40\u0e22\u0e35\u0e48\u0e22\u0e21\u0e21\u0e32\u0e01\";\n feedbackMsg.style.color = \"#00ff00\";\n } else {\n btn.classList.add('wrong');\n feedbackMsg.textContent = \"\u0e22\u0e31\u0e07\u0e44\u0e21\u0e48\u0e16\u0e39\u0e01\u0e19\u0e30 \u0e04\u0e33\u0e15\u0e2d\u0e1a\u0e04\u0e37\u0e2d \" + correct;\n feedbackMsg.style.color = \"#ff4b2b\";\n \n \/\/ \u0e40\u0e09\u0e25\u0e22\u0e1b\u0e38\u0e48\u0e21\u0e17\u0e35\u0e48\u0e16\u0e39\u0e01\n buttons.forEach(b => {\n if (parseInt(b.textContent) === correct) {\n b.classList.add('correct');\n }\n });\n }\n\n \/\/ \u0e25\u0e47\u0e2d\u0e04\u0e17\u0e38\u0e01\u0e1b\u0e38\u0e48\u0e21\n buttons.forEach(b => b.disabled = true);\n nextBtn.classList.remove('hidden');\n }\n\n function endGame() {\n gameScreen.classList.add('hidden');\n resultScreen.classList.remove('hidden');\n finalScoreDisplay.textContent = score;\n\n if (score === 10) {\n cheerMsg.textContent = \"\u0e2a\u0e38\u0e14\u0e22\u0e2d\u0e14! \u0e2d\u0e31\u0e08\u0e09\u0e23\u0e34\u0e22\u0e30\u0e17\u0e32\u0e07\u0e04\u0e13\u0e34\u0e15\u0e28\u0e32\u0e2a\u0e15\u0e23\u0e4c \ud83c\udf1f\";\n } else if (score >= 7) {\n cheerMsg.textContent = \"\u0e40\u0e01\u0e48\u0e07\u0e21\u0e32\u0e01! \u0e1d\u0e36\u0e01\u0e2d\u0e35\u0e01\u0e19\u0e34\u0e14\u0e08\u0e30\u0e40\u0e17\u0e1e\u0e40\u0e25\u0e22 \ud83d\udc4d\";\n } else {\n cheerMsg.textContent = \"\u0e1e\u0e22\u0e32\u0e22\u0e32\u0e21\u0e40\u0e02\u0e49\u0e32! \u0e2a\u0e39\u0e49\u0e46 \u0e19\u0e30 \u270c\ufe0f\";\n }\n }\n\n function restartGame() {\n startGame();\n }\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>\u0e40\u0e01\u0e21\u0e04\u0e13\u0e34\u0e15\u0e28\u0e32\u0e2a\u0e15\u0e23\u0e4c \u0e1b.3: \u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e2b\u0e32\u0e23\u0e40\u0e25\u0e02 \ud83d\ude80 \u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e2b\u0e32\u0e23\u0e40\u0e25\u0e02 \u0e02\u0e49\u0e2d\u0e17\u0e35\u0e48: 1\/10 \u0e04\u0e30\u0e41\u0e19\u0e19: 0 Loading… \u0e02\u0e49\u0e2d\u0e15\u0e48\u0e2d\u0e44\u0e1b \u2794 \u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e2a\u0e33\u0e40\u0e23\u0e47\u0e08! \ud83c\udf0e \u0e04\u0e30\u0e41\u0e19\u0e19\u0e23\u0e27\u0e21: \/10 \u0e40\u0e23\u0e34\u0e48\u0e21\u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e43\u0e2b\u0e21\u0e48 \u21ba<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-404","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=\/wp\/v2\/posts\/404","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=404"}],"version-history":[{"count":2,"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=\/wp\/v2\/posts\/404\/revisions"}],"predecessor-version":[{"id":406,"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=\/wp\/v2\/posts\/404\/revisions\/406"}],"wp:attachment":[{"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=404"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=404"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=404"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":404,"date":"2025-12-01T13:38:11","date_gmt":"2025-12-01T06:38:11","guid":{"rendered":"http:\/\/www.nsh.ac.th\/?p=404"},"modified":"2025-12-01T13:38:49","modified_gmt":"2025-12-01T06:38:49","slug":"game-primary-3","status":"publish","type":"post","link":"http:\/\/www.nsh.ac.th\/?p=404","title":{"rendered":"Game Primary 3"},"content":{"rendered":"\n\n\n\n \n \n \u0e40\u0e01\u0e21\u0e04\u0e13\u0e34\u0e15\u0e28\u0e32\u0e2a\u0e15\u0e23\u0e4c \u0e1b.3: \u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e2b\u0e32\u0e23\u0e40\u0e25\u0e02<\/title>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Kanit:wght@400;700&display=swap\" rel=\"stylesheet\">\n <style>\n body {\n font-family: 'Kanit', sans-serif;\n background-color: #0f0c29;\n background-image: linear-gradient(315deg, #0f0c29 0%, #302b63 74%, #24243e 100%);\n color: white;\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 100vh;\n margin: 0;\n overflow: hidden;\n }\n\n \/* \u0e2a\u0e23\u0e49\u0e32\u0e07\u0e14\u0e32\u0e27\u0e27\u0e34\u0e1a\u0e27\u0e31\u0e1a\u0e43\u0e19\u0e1e\u0e37\u0e49\u0e19\u0e2b\u0e25\u0e31\u0e07 *\/\n .stars {\n position: absolute;\n top: 0; left: 0; width: 100%; height: 100%;\n pointer-events: none;\n background-image: \n radial-gradient(white, rgba(255,255,255,.2) 2px, transparent 3px),\n radial-gradient(white, rgba(255,255,255,.15) 1px, transparent 2px),\n radial-gradient(white, rgba(255,255,255,.1) 2px, transparent 3px);\n background-size: 550px 550px, 350px 350px, 250px 250px;\n background-position: 0 0, 40px 60px, 130px 270px;\n }\n\n .game-container {\n background: rgba(255, 255, 255, 0.1);\n backdrop-filter: blur(10px);\n padding: 40px;\n border-radius: 20px;\n border: 2px solid rgba(255, 255, 255, 0.2);\n box-shadow: 0 0 20px rgba(0, 255, 255, 0.5);\n text-align: center;\n width: 90%;\n max-width: 500px;\n position: relative;\n z-index: 10;\n }\n\n h1 {\n margin: 0 0 20px;\n font-size: 2rem;\n color: #00ffff; \/* \u0e2a\u0e35\u0e1f\u0e49\u0e32\u0e19\u0e35\u0e2d\u0e2d\u0e19 *\/\n text-shadow: 0 0 10px #00ffff;\n }\n\n .score-panel {\n font-size: 1.2rem;\n margin-bottom: 20px;\n display: flex;\n justify-content: space-between;\n padding: 10px 20px;\n background: rgba(0, 0, 0, 0.3);\n border-radius: 10px;\n }\n\n .question-box {\n font-size: 4rem;\n font-weight: bold;\n margin: 20px 0;\n color: #fff;\n text-shadow: 2px 2px 0px #ff00de; \/* \u0e40\u0e07\u0e32\u0e2a\u0e35\u0e0a\u0e21\u0e1e\u0e39 *\/\n animation: float 3s ease-in-out infinite;\n }\n\n @keyframes float {\n 0% { transform: translateY(0px); }\n 50% { transform: translateY(-10px); }\n 100% { transform: translateY(0px); }\n }\n\n .options-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 15px;\n margin-top: 20px;\n }\n\n .option-btn {\n background: linear-gradient(45deg, #ff0099, #493240);\n border: none;\n border-radius: 15px;\n padding: 20px;\n font-size: 2rem;\n color: white;\n font-family: 'Kanit', sans-serif;\n font-weight: bold;\n cursor: pointer;\n transition: transform 0.1s, box-shadow 0.2s;\n box-shadow: 0 5px 0 #96005a;\n }\n\n .option-btn:active {\n transform: translateY(4px);\n box-shadow: 0 1px 0 #96005a;\n }\n\n .option-btn:hover {\n filter: brightness(1.2);\n }\n\n .option-btn.correct {\n background: linear-gradient(45deg, #00b09b, #96c93d) !important;\n box-shadow: 0 5px 0 #00685b !important;\n }\n\n .option-btn.wrong {\n background: linear-gradient(45deg, #ff416c, #ff4b2b) !important;\n box-shadow: 0 5px 0 #a60000 !important;\n opacity: 0.6;\n }\n\n .btn-next {\n margin-top: 25px;\n padding: 10px 30px;\n font-size: 1.5rem;\n background-color: #fff;\n color: #333;\n border: none;\n border-radius: 50px;\n cursor: pointer;\n font-family: 'Kanit', sans-serif;\n font-weight: bold;\n box-shadow: 0 0 15px white;\n }\n \n .hidden { display: none; }\n\n .mascot {\n font-size: 3rem;\n margin-bottom: 10px;\n }\n <\/style>\n<\/head>\n<body>\n\n <div class=\"stars\"><\/div>\n\n <div class=\"game-container\">\n <div id=\"game-screen\">\n <div class=\"mascot\">\ud83d\ude80<\/div>\n <h1>\u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e2b\u0e32\u0e23\u0e40\u0e25\u0e02<\/h1>\n \n <div class=\"score-panel\">\n <span>\u0e02\u0e49\u0e2d\u0e17\u0e35\u0e48: <span id=\"q-number\">1<\/span>\/10<\/span>\n <span>\u0e04\u0e30\u0e41\u0e19\u0e19: <span id=\"score\">0<\/span><\/span>\n <\/div>\n\n <div class=\"question-box\" id=\"question-text\">\n Loading…\n <\/div>\n\n <div class=\"options-grid\" id=\"options-container\">\n <\/div>\n\n <button id=\"next-btn\" class=\"btn-next hidden\" onclick=\"generateQuestion()\">\u0e02\u0e49\u0e2d\u0e15\u0e48\u0e2d\u0e44\u0e1b \u2794<\/button>\n <div id=\"feedback-msg\" style=\"margin-top:10px; height: 24px;\"><\/div>\n <\/div>\n\n <div id=\"result-screen\" class=\"hidden\">\n <h1>\u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e2a\u0e33\u0e40\u0e23\u0e47\u0e08!<\/h1>\n <div style=\"font-size: 5rem;\">\ud83c\udf0e<\/div>\n <p style=\"font-size: 1.5rem;\">\u0e04\u0e30\u0e41\u0e19\u0e19\u0e23\u0e27\u0e21: <span id=\"final-score\"><\/span>\/10<\/p>\n <p id=\"cheer-msg\"><\/p>\n <button class=\"btn-next\" onclick=\"restartGame()\">\u0e40\u0e23\u0e34\u0e48\u0e21\u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e43\u0e2b\u0e21\u0e48 \u21ba<\/button>\n <\/div>\n <\/div>\n\n <script>\n let score = 0;\n let questionCount = 0;\n const totalQuestions = 10;\n \n const questionText = document.getElementById('question-text');\n const optionsContainer = document.getElementById('options-container');\n const nextBtn = document.getElementById('next-btn');\n const scoreDisplay = document.getElementById('score');\n const qNumDisplay = document.getElementById('q-number');\n const feedbackMsg = document.getElementById('feedback-msg');\n \n const gameScreen = document.getElementById('game-screen');\n const resultScreen = document.getElementById('result-screen');\n const finalScoreDisplay = document.getElementById('final-score');\n const cheerMsg = document.getElementById('cheer-msg');\n\n \/\/ \u0e40\u0e23\u0e34\u0e48\u0e21\u0e40\u0e01\u0e21\u0e04\u0e23\u0e31\u0e49\u0e07\u0e41\u0e23\u0e01\n startGame();\n\n function startGame() {\n score = 0;\n questionCount = 0;\n scoreDisplay.textContent = 0;\n gameScreen.classList.remove('hidden');\n resultScreen.classList.add('hidden');\n generateQuestion();\n }\n\n function generateQuestion() {\n \/\/ \u0e40\u0e0a\u0e47\u0e04\u0e27\u0e48\u0e32\u0e04\u0e23\u0e1a 10 \u0e02\u0e49\u0e2d\u0e2b\u0e23\u0e37\u0e2d\u0e22\u0e31\u0e07\n if (questionCount >= totalQuestions) {\n endGame();\n return;\n }\n\n questionCount++;\n qNumDisplay.textContent = questionCount;\n resetState();\n\n \/\/ --- Logic \u0e2a\u0e23\u0e49\u0e32\u0e07\u0e42\u0e08\u0e17\u0e22\u0e4c\u0e01\u0e32\u0e23\u0e2b\u0e32\u0e23 (\u0e25\u0e07\u0e15\u0e31\u0e27\u0e40\u0e2a\u0e21\u0e2d) ---\n \/\/ \u0e2a\u0e39\u0e15\u0e23: A \/ B = C\n \/\/ \u0e40\u0e23\u0e32\u0e08\u0e30\u0e2a\u0e38\u0e48\u0e21 B (\u0e15\u0e31\u0e27\u0e2b\u0e32\u0e23) \u0e41\u0e25\u0e30 C (\u0e04\u0e33\u0e15\u0e2d\u0e1a) \u0e01\u0e48\u0e2d\u0e19 \u0e41\u0e25\u0e49\u0e27\u0e04\u0e48\u0e2d\u0e22\u0e04\u0e39\u0e13\u0e01\u0e25\u0e31\u0e1a\u0e44\u0e1b\u0e2b\u0e32 A (\u0e15\u0e31\u0e27\u0e15\u0e31\u0e49\u0e07)\n \/\/ \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e43\u0e2b\u0e49\u0e21\u0e31\u0e48\u0e19\u0e43\u0e08\u0e27\u0e48\u0e32\u0e2b\u0e32\u0e23\u0e25\u0e07\u0e15\u0e31\u0e27\u0e41\u0e19\u0e48\u0e19\u0e2d\u0e19\n \n const divisor = Math.floor(Math.random() * 9) + 2; \/\/ \u0e2a\u0e38\u0e48\u0e21\u0e15\u0e31\u0e27\u0e2b\u0e32\u0e23 2 \u0e16\u0e36\u0e07 10\n const answer = Math.floor(Math.random() * 10) + 1; \/\/ \u0e2a\u0e38\u0e48\u0e21\u0e04\u0e33\u0e15\u0e2d\u0e1a 1 \u0e16\u0e36\u0e07 10\n const dividend = divisor * answer; \/\/ \u0e04\u0e33\u0e19\u0e27\u0e13\u0e15\u0e31\u0e27\u0e15\u0e31\u0e49\u0e07\n\n questionText.textContent = `${dividend} \u00f7 ${divisor} = ?`;\n\n \/\/ \u0e2a\u0e23\u0e49\u0e32\u0e07\u0e15\u0e31\u0e27\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e04\u0e33\u0e15\u0e2d\u0e1a 4 \u0e02\u0e49\u0e2d\n let options = new Set();\n options.add(answer); \/\/ \u0e43\u0e2a\u0e48\u0e04\u0e33\u0e15\u0e2d\u0e1a\u0e17\u0e35\u0e48\u0e16\u0e39\u0e01\u0e01\u0e48\u0e2d\u0e19\n\n \/\/ \u0e2a\u0e38\u0e48\u0e21\u0e15\u0e31\u0e27\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e2b\u0e25\u0e2d\u0e01 (\u0e44\u0e21\u0e48\u0e43\u0e2b\u0e49\u0e0b\u0e49\u0e33\u0e01\u0e31\u0e1a\u0e04\u0e33\u0e15\u0e2d\u0e1a\u0e08\u0e23\u0e34\u0e07)\n while(options.size < 4) {\n let wrongAnswer = Math.floor(Math.random() * 12) + 1;\n if (wrongAnswer !== answer) {\n options.add(wrongAnswer);\n }\n }\n\n \/\/ \u0e41\u0e1b\u0e25\u0e07 Set \u0e40\u0e1b\u0e47\u0e19 Array \u0e41\u0e25\u0e49\u0e27\u0e2a\u0e38\u0e48\u0e21\u0e25\u0e33\u0e14\u0e31\u0e1a\n const optionsArray = Array.from(options).sort(() => Math.random() - 0.5);\n\n \/\/ \u0e2a\u0e23\u0e49\u0e32\u0e07\u0e1b\u0e38\u0e48\u0e21\n optionsArray.forEach(opt => {\n const btn = document.createElement('button');\n btn.textContent = opt;\n btn.classList.add('option-btn');\n btn.onclick = () => checkAnswer(btn, opt, answer);\n optionsContainer.appendChild(btn);\n });\n }\n\n function resetState() {\n nextBtn.classList.add('hidden');\n feedbackMsg.textContent = \"\";\n while (optionsContainer.firstChild) {\n optionsContainer.removeChild(optionsContainer.firstChild);\n }\n }\n\n function checkAnswer(btn, selected, correct) {\n const buttons = optionsContainer.querySelectorAll('.option-btn');\n \n if (selected === correct) {\n btn.classList.add('correct');\n score++;\n scoreDisplay.textContent = score;\n feedbackMsg.textContent = \"\u0e16\u0e39\u0e01\u0e15\u0e49\u0e2d\u0e07\u0e04\u0e23\u0e31\u0e1a! \u0e40\u0e22\u0e35\u0e48\u0e22\u0e21\u0e21\u0e32\u0e01\";\n feedbackMsg.style.color = \"#00ff00\";\n } else {\n btn.classList.add('wrong');\n feedbackMsg.textContent = \"\u0e22\u0e31\u0e07\u0e44\u0e21\u0e48\u0e16\u0e39\u0e01\u0e19\u0e30 \u0e04\u0e33\u0e15\u0e2d\u0e1a\u0e04\u0e37\u0e2d \" + correct;\n feedbackMsg.style.color = \"#ff4b2b\";\n \n \/\/ \u0e40\u0e09\u0e25\u0e22\u0e1b\u0e38\u0e48\u0e21\u0e17\u0e35\u0e48\u0e16\u0e39\u0e01\n buttons.forEach(b => {\n if (parseInt(b.textContent) === correct) {\n b.classList.add('correct');\n }\n });\n }\n\n \/\/ \u0e25\u0e47\u0e2d\u0e04\u0e17\u0e38\u0e01\u0e1b\u0e38\u0e48\u0e21\n buttons.forEach(b => b.disabled = true);\n nextBtn.classList.remove('hidden');\n }\n\n function endGame() {\n gameScreen.classList.add('hidden');\n resultScreen.classList.remove('hidden');\n finalScoreDisplay.textContent = score;\n\n if (score === 10) {\n cheerMsg.textContent = \"\u0e2a\u0e38\u0e14\u0e22\u0e2d\u0e14! \u0e2d\u0e31\u0e08\u0e09\u0e23\u0e34\u0e22\u0e30\u0e17\u0e32\u0e07\u0e04\u0e13\u0e34\u0e15\u0e28\u0e32\u0e2a\u0e15\u0e23\u0e4c \ud83c\udf1f\";\n } else if (score >= 7) {\n cheerMsg.textContent = \"\u0e40\u0e01\u0e48\u0e07\u0e21\u0e32\u0e01! \u0e1d\u0e36\u0e01\u0e2d\u0e35\u0e01\u0e19\u0e34\u0e14\u0e08\u0e30\u0e40\u0e17\u0e1e\u0e40\u0e25\u0e22 \ud83d\udc4d\";\n } else {\n cheerMsg.textContent = \"\u0e1e\u0e22\u0e32\u0e22\u0e32\u0e21\u0e40\u0e02\u0e49\u0e32! \u0e2a\u0e39\u0e49\u0e46 \u0e19\u0e30 \u270c\ufe0f\";\n }\n }\n\n function restartGame() {\n startGame();\n }\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>\u0e40\u0e01\u0e21\u0e04\u0e13\u0e34\u0e15\u0e28\u0e32\u0e2a\u0e15\u0e23\u0e4c \u0e1b.3: \u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e2b\u0e32\u0e23\u0e40\u0e25\u0e02 \ud83d\ude80 \u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e2b\u0e32\u0e23\u0e40\u0e25\u0e02 \u0e02\u0e49\u0e2d\u0e17\u0e35\u0e48: 1\/10 \u0e04\u0e30\u0e41\u0e19\u0e19: 0 Loading… \u0e02\u0e49\u0e2d\u0e15\u0e48\u0e2d\u0e44\u0e1b \u2794 \u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e2a\u0e33\u0e40\u0e23\u0e47\u0e08! \ud83c\udf0e \u0e04\u0e30\u0e41\u0e19\u0e19\u0e23\u0e27\u0e21: \/10 \u0e40\u0e23\u0e34\u0e48\u0e21\u0e20\u0e32\u0e23\u0e01\u0e34\u0e08\u0e43\u0e2b\u0e21\u0e48 \u21ba<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-404","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=\/wp\/v2\/posts\/404","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=404"}],"version-history":[{"count":2,"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=\/wp\/v2\/posts\/404\/revisions"}],"predecessor-version":[{"id":406,"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=\/wp\/v2\/posts\/404\/revisions\/406"}],"wp:attachment":[{"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=404"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=404"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.nsh.ac.th\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=404"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}