Computer Knowledge Quiz
Computer Knowledge Quiz
Test your computer skills across different difficulty levels!
About This Quiz
- 3 difficulty levels to choose from
- Multiple choice questions
- See all answers at the end
- Get a personalized certificate
- No time limit
Quiz Completed!
Here are your results and answers
Certificate of Completion
Computer Knowledge Quiz
This certificate is proudly presented to
```html
const quizScreen = document.getElementById('quiz-screen');
const resultsScreen = document.getElementById('results-screen');
const questionText = document.getElementById('question-text');
const optionsContainer = document.getElementById('options-container');
const scoreDisplay = document.getElementById('score-display');
const answersContainer = document.getElementById('answers-container');
const certificateName = document.getElementById('certificate-name');
const certificateLevel = document.getElementById('certificate-level');
const certificateScore = document.getElementById('certificate-score');
const certificateDate = document.getElementById('certificate-date');
function startQuiz(level) {
userName = document.getElementById('user-name').value.trim();
if (!userName) {
document.getElementById('name-error').classList.remove('hidden');
return;
}
document.getElementById('name-error').classList.add('hidden');
currentLevel = level;
currentQuestion = 0;
score = 0;
userAnswers = [];
welcomeScreen.classList.add('hidden');
quizScreen.classList.remove('hidden');
loadQuestion();
}
function loadQuestion() {
const questions = quizData[currentLevel];
const question = questions[currentQuestion];
questionText.textContent = question.question;
optionsContainer.innerHTML = '';
question.options.forEach((option, index) => {
const optionButton = document.createElement('button');
optionButton.textContent = option;
optionButton.className = 'bg-gray-200 hover:bg-gray-300 text-gray-800 font-semibold py-2 px-4 rounded-lg w-full';
optionButton.onclick = () => selectAnswer(option);
optionsContainer.appendChild(optionButton);
});
document.getElementById('progress').textContent = `Question ${currentQuestion + 1} of ${questions.length}`;
}
function selectAnswer(selectedOption) {
const questions = quizData[currentLevel];
const question = questions[currentQuestion];
userAnswers.push({
question: question.question,
selected: selectedOption,
correct: question.answer
});
if (selectedOption === question.answer) {
score++;
}
nextQuestion();
}
function nextQuestion() {
const questions = quizData[currentLevel];
currentQuestion++;
if (currentQuestion < questions.length) {
loadQuestion();
} else {
showResults();
}
}
function showResults() {
quizScreen.classList.add('hidden');
resultsScreen.classList.remove('hidden');
scoreDisplay.textContent = `You scored ${score} out of ${quizData[currentLevel].length}`;
userAnswers.forEach(answer => {
const answerElement = document.createElement('div');
answerElement.className = 'mb-4';
answerElement.innerHTML = `
Q: ${answer.question}
Your Answer: ${answer.selected}
Correct Answer: ${answer.correct}
`;
answersContainer.appendChild(answerElement);
});
certificateName.textContent = userName;
certificateLevel.textContent = currentLevel.charAt(0).toUpperCase() + currentLevel.slice(1);
certificateScore.textContent = score;
certificateDate.textContent = new Date().toLocaleDateString();
}
function goBack() {
resultsScreen.classList.add('hidden');
welcomeScreen.classList.remove('hidden');
answersContainer.innerHTML = '';
}
function restartQuiz() {
resultsScreen.classList.add('hidden');
welcomeScreen.classList.remove('hidden');
answersContainer.innerHTML = '';
}
