Nihongo Challenge N3 May 2026
// フィードバックメッセージ let feedbackMsg = ""; if (answerLocked) if (isUserCorrect) feedbackMsg = `✅ 正解! $escapeHtml(explanation)`; else const correctAnswerText = q.options[correctIdx]; feedbackMsg = `❌ 不正解... 正解は「$escapeHtml(correctAnswerText)」です。 $escapeHtml(explanation)`; else feedbackMsg = "🤔 選択肢をクリックして答えましょう!";
if (answerLocked) if (isCorrectOption) additionalClass = "correct-highlight"; if (isSelectedWrongOption) additionalClass = "selected-wrong"; if (isSelectedCorrect) additionalClass = "selected-correct"; nihongo challenge n3
// ------------------- App State ------------------- let currentQuestions = []; // 実際に使用する問題リスト (シャッフル済み) let currentIndex = 0; // 現在の問題番号 (0から) let userScore = 0; // 正解数 let answerLocked = false; // 回答済みで選択不可か let selectedOptionIndex = null; // 現在の問題で選んだ選択肢インデックス let currentQuestionObj = null; // フィードバックメッセージ let feedbackMsg = ""
footer font-size: 0.7rem; text-align: center; padding: 1rem; background: #f9f3e2; color: #8b765a; else const correctAnswerText = q.options[correctIdx]
@media (max-width: 550px) .quiz-main padding: 1.5rem; .question-text font-size: 1.3rem; .option-btn padding: 0.8rem 1rem; .header h1 font-size: 1.5rem; </style> </head> <body> <div class="challenge-container" id="quizApp"> <div class="header"> <h1> <span>📘 N3</span> <span>にほんごチャレンジ</span> </h1> <div class="sub">日本語能力試験N3レベル · 文法 & 語彙</div> </div> <div class="stats-panel"> <div class="score-box">🎯 スコア: <span id="scoreValue">0</span></div> <div class="question-counter">📋 問題: <span id="currentQNumber">1</span> / <span id="totalQNumber">0</span></div> </div> <div id="dynamicContent"> <!-- dynamic content injected via js --> </div> <footer>✨ N3チャレンジ — 正解を選んで日本語力を磨こう!</footer> </div>
const nextDisabled = !answerLocked ? 'disabled' : '';