475 lines
21 KiB
JavaScript
475 lines
21 KiB
JavaScript
|
// 存储各难度题目的正确答案
|
|||
|
|
const correctAnswers = {
|
|||
|
|
medium: {
|
|||
|
|
mq1: 'B',
|
|||
|
|
mq2: 'D',
|
|||
|
|
mq3: 'B',
|
|||
|
|
mq4: 'A',
|
|||
|
|
mq5: 'C'
|
|||
|
|
},
|
|||
|
|
easy: {
|
|||
|
|
eq1: 'B',
|
|||
|
|
eq2: 'A',
|
|||
|
|
eq3: 'C',
|
|||
|
|
eq4: 'B',
|
|||
|
|
eq5: 'A'
|
|||
|
|
},
|
|||
|
|
hard: {
|
|||
|
|
hq1: 'C',
|
|||
|
|
hq2: 'A',
|
|||
|
|
hq3: 'C',
|
|||
|
|
hq4: 'A',
|
|||
|
|
hq5: 'B'
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
// 所有试题数据
|
|||
|
|
const quizQuestions = [
|
|||
|
|
// 中等难度题目
|
|||
|
|
{
|
|||
|
|
id: 'mq1',
|
|||
|
|
difficulty: 'medium',
|
|||
|
|
number: 1,
|
|||
|
|
points: 20,
|
|||
|
|
text: '下列关于万有引力定律的说法中，正确的是：',
|
|||
|
|
options: [
|
|||
|
|
{ id: 'mq1-a', label: 'A', text: '万有引力定律只适用于天体之间的相互作用' },
|
|||
|
|
{ id: 'mq1-b', label: 'B', text: '两个物体之间的万有引力大小与它们距离的平方成反比' },
|
|||
|
|
{ id: 'mq1-c', label: 'C', text: '万有引力的方向总是垂直于两个物体的连线方向' },
|
|||
|
|
{ id: 'mq1-d', label: 'D', text: '万有引力常量G是牛顿通过实验测量得出的' }
|
|||
|
|
],
|
|||
|
|
explanation: '正确答案：B<br>解析：万有引力定律适用于宇宙中任何两个有质量的物体之间的相互作用，不仅限于天体，故A错误；根据万有引力公式F=G(m₁m₂)/r²，两个物体之间的万有引力大小与它们距离的平方成反比，故B正确；万有引力的方向总是沿着两个物体的连线方向，故C错误；万有引力常量G是卡文迪许通过扭秤实验测量得出的，故D错误。'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
id: 'mq2',
|
|||
|
|
difficulty: 'medium',
|
|||
|
|
number: 2,
|
|||
|
|
points: 20,
|
|||
|
|
text: '地球表面的重力加速度为g，若地球的质量不变，但半径变为原来的一半，则地球表面的重力加速度变为：',
|
|||
|
|
options: [
|
|||
|
|
{ id: 'mq2-a', label: 'A', text: 'g/4' },
|
|||
|
|
{ id: 'mq2-b', label: 'B', text: 'g/2' },
|
|||
|
|
{ id: 'mq2-c', label: 'C', text: '2g' },
|
|||
|
|
{ id: 'mq2-d', label: 'D', text: '4g' }
|
|||
|
|
],
|
|||
|
|
explanation: '正确答案：D<br>解析：根据重力加速度公式g=GM/R²，其中G为万有引力常量，M为地球质量，R为地球半径。当地球质量M不变，半径R变为原来的一半时，新的重力加速度g\'=GM/(R/2)²=4GM/R²=4g，故答案为D。'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
id: 'mq3',
|
|||
|
|
difficulty: 'medium',
|
|||
|
|
number: 3,
|
|||
|
|
points: 20,
|
|||
|
|
text: '人造地球卫星绕地球做匀速圆周运动，若轨道半径增大到原来的2倍，则卫星的线速度大小变为原来的：',
|
|||
|
|
options: [
|
|||
|
|
{ id: 'mq3-a', label: 'A', text: '1/2' },
|
|||
|
|
{ id: 'mq3-b', label: 'B', text: '1/√2' },
|
|||
|
|
{ id: 'mq3-c', label: 'C', text: '√2倍' },
|
|||
|
|
{ id: 'mq3-d', label: 'D', text: '2倍' }
|
|||
|
|
],
|
|||
|
|
explanation: '正确答案：B<br>解析：根据万有引力提供向心力的公式GMm/r²=mv²/r，可得 satellite line speed v=√(GM/r)。当轨道半径r增大到原来的2倍时，新的线速度v\'=√(GM/(2r))=v/√2，故答案为B。'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
id: 'mq4',
|
|||
|
|
difficulty: 'medium',
|
|||
|
|
number: 4,
|
|||
|
|
points: 20,
|
|||
|
|
text: '两个质量分别为m和M的物体相距为r，它们之间的万有引力大小为F。若将它们的距离变为2r，质量分别变为2m和3M，则它们之间的万有引力大小变为：',
|
|||
|
|
options: [
|
|||
|
|
{ id: 'mq4-a', label: 'A', text: '3F/2' },
|
|||
|
|
{ id: 'mq4-b', label: 'B', text: '3F/4' },
|
|||
|
|
{ id: 'mq4-c', label: 'C', text: 'F/2' },
|
|||
|
|
{ id: 'mq4-d', label: 'D', text: '2F/3' }
|
|||
|
|
],
|
|||
|
|
explanation: '正确答案：A<br>解析：根据万有引力公式F=G(mM)/r²，变化后的万有引力F\'=G(2m·3M)/(2r)²=6GMm/4r²=3GMm/2r²=3F/2，故答案为A。'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
id: 'mq5',
|
|||
|
|
difficulty: 'medium',
|
|||
|
|
number: 5,
|
|||
|
|
points: 20,
|
|||
|
|
text: '关于开普勒行星运动定律，下列说法正确的是：',
|
|||
|
|
options: [
|
|||
|
|
{ id: 'mq5-a', label: 'A', text: '所有行星绕太阳运动的轨道都是正圆形' },
|
|||
|
|
{ id: 'mq5-b', label: 'B', text: '行星在近日点的速率小于在远日点的速率' },
|
|||
|
|
{ id: 'mq5-c', label: 'C', text: '所有行星的轨道半长轴的三次方与公转周期的二次方的比值都相等' },
|
|||
|
|
{ id: 'mq5-d', label: 'D', text: '开普勒定律仅适用于行星绕太阳的运动' }
|
|||
|
|
],
|
|||
|
|
explanation: '正确答案：C<br>解析：开普勒第一定律指出所有行星绕太阳运动的轨道都是椭圆，太阳处在椭圆的一个焦点上，故A错误；根据开普勒第二定律，行星与太阳的连线在相等时间内扫过相等的面积，因此行星在近日点的速率大于在远日点的速率，故B错误；开普勒第三定律表明所有行星的轨道半长轴的三次方与公转周期的二次方的比值都相等，故C正确；开普勒定律不仅适用于行星绕太阳的运动，也适用于卫星绕行星的运动，只是比值不同，故D错误。'
|
|||
|
|
},
|
|||
|
|
// 简单难度题目
|
|||
|
|
{
|
|||
|
|
id: 'eq1',
|
|||
|
|
difficulty: 'easy',
|
|||
|
|
number: 1,
|
|||
|
|
points: 20,
|
|||
|
|
text: '万有引力定律是由哪位科学家提出的？',
|
|||
|
|
options: [
|
|||
|
|
{ id: 'eq1-a', label: 'A', text: '爱因斯坦' },
|
|||
|
|
{ id: 'eq1-b', label: 'B', text: '牛顿' },
|
|||
|
|
{ id: 'eq1-c', label: 'C', text: '伽利略' },
|
|||
|
|
{ id: 'eq1-d', label: 'D', text: '开普勒' }
|
|||
|
|
],
|
|||
|
|
explanation: '正确答案：B<br>解析：万有引力定律是由英国科学家牛顿在1687年提出的，故答案为B。'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
id: 'eq2',
|
|||
|
|
difficulty: 'easy',
|
|||
|
|
number: 2,
|
|||
|
|
points: 20,
|
|||
|
|
text: '地球对物体的吸引力称为：',
|
|||
|
|
options: [
|
|||
|
|
{ id: 'eq2-a', label: 'A', text: '重力' },
|
|||
|
|
{ id: 'eq2-b', label: 'B', text: '摩擦力' },
|
|||
|
|
{ id: 'eq2-c', label: 'C', text: '弹力' },
|
|||
|
|
{ id: 'eq2-d', label: 'D', text: '向心力' }
|
|||
|
|
],
|
|||
|
|
explanation: '正确答案：A<br>解析：地球对物体的吸引力称为重力，故答案为A。'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
id: 'eq3',
|
|||
|
|
difficulty: 'easy',
|
|||
|
|
number: 3,
|
|||
|
|
points: 20,
|
|||
|
|
text: '下列哪个现象与万有引力无关？',
|
|||
|
|
options: [
|
|||
|
|
{ id: 'eq3-a', label: 'A', text: '苹果落地' },
|
|||
|
|
{ id: 'eq3-b', label: 'B', text: '月球绕地球运动' },
|
|||
|
|
{ id: 'eq3-c', label: 'C', text: '磁铁吸引铁钉' },
|
|||
|
|
{ id: 'eq3-d', label: 'D', text: '地球绕太阳公转' }
|
|||
|
|
],
|
|||
|
|
explanation: '正确答案：C<br>解析：磁铁吸引铁钉是磁力作用的结果，与万有引力无关，故答案为C。'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
id: 'eq4',
|
|||
|
|
difficulty: 'easy',
|
|||
|
|
number: 4,
|
|||
|
|
points: 20,
|
|||
|
|
text: '物体的质量越大，它受到的重力就：',
|
|||
|
|
options: [
|
|||
|
|
{ id: 'eq4-a', label: 'A', text: '越小' },
|
|||
|
|
{ id: 'eq4-b', label: 'B', text: '越大' },
|
|||
|
|
{ id: 'eq4-c', label: 'C', text: '不变' },
|
|||
|
|
{ id: 'eq4-d', label: 'D', text: '无法确定' }
|
|||
|
|
],
|
|||
|
|
explanation: '正确答案：B<br>解析：根据重力公式G=mg，物体受到的重力与质量成正比，质量越大，重力越大，故答案为B。'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
id: 'eq5',
|
|||
|
|
difficulty: 'easy',
|
|||
|
|
number: 5,
|
|||
|
|
points: 20,
|
|||
|
|
text: '在地球表面，重力加速度g的近似值为：',
|
|||
|
|
options: [
|
|||
|
|
{ id: 'eq5-a', label: 'A', text: '9.8 m/s²' },
|
|||
|
|
{ id: 'eq5-b', label: 'B', text: '5.0 m/s²' },
|
|||
|
|
{ id: 'eq5-c', label: 'C', text: '15.6 m/s²' },
|
|||
|
|
{ id: 'eq5-d', label: 'D', text: '3.0 m/s²' }
|
|||
|
|
],
|
|||
|
|
explanation: '正确答案：A<br>解析：在地球表面，重力加速度g的近似值为9.8 m/s²，故答案为A。'
|
|||
|
|
},
|
|||
|
|
// 高级难度题目
|
|||
|
|
{
|
|||
|
|
id: 'hq1',
|
|||
|
|
difficulty: 'hard',
|
|||
|
|
number: 1,
|
|||
|
|
points: 20,
|
|||
|
|
text: '已知地球质量为M，半径为R，万有引力常量为G。一颗人造卫星在离地面高度为R的圆形轨道上运行，则该卫星的运行周期为：',
|
|||
|
|
options: [
|
|||
|
|
{ id: 'hq1-a', label: 'A', text: '2π√(2R³/GM)' },
|
|||
|
|
{ id: 'hq1-b', label: 'B', text: '4π√(2R³/GM)' },
|
|||
|
|
{ id: 'hq1-c', label: 'C', text: '2π√(8R³/GM)' },
|
|||
|
|
{ id: 'hq1-d', label: 'D', text: '4π√(R³/GM)' }
|
|||
|
|
],
|
|||
|
|
explanation: '正确答案：C<br>解析：卫星轨道半径r=R+h=2R，根据万有引力提供向心力：GMm/r²=m(2π/T)²r，解得T=2π√(r³/GM)=2π√((2R)³/GM)=2π√(8R³/GM)，故答案为C。'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
id: 'hq2',
|
|||
|
|
difficulty: 'hard',
|
|||
|
|
number: 2,
|
|||
|
|
points: 20,
|
|||
|
|
text: '两个质量分别为m1和m2的星球组成双星系统，它们绕两者连线上某一点做匀速圆周运动，两星球之间的距离为L。则它们的运行周期T为：',
|
|||
|
|
options: [
|
|||
|
|
{ id: 'hq2-a', label: 'A', text: '2π√(L³/G(m1+m2))' },
|
|||
|
|
{ id: 'hq2-b', label: 'B', text: '2π√(L³/2G(m1+m2))' },
|
|||
|
|
{ id: 'hq2-c', label: 'C', text: '2π√(L³/Gm1m2)' },
|
|||
|
|
{ id: 'hq2-d', label: 'D', text: '2π√(L³/G|m1-m2|)' }
|
|||
|
|
],
|
|||
|
|
explanation: '正确答案：A<br>解析：双星系统中，万有引力提供向心力，且两星球的角速度相等。设m1和m2到质心的距离分别为r1和r2，则r1+r2=L，m1ω²r1=m2ω²r2=Gm1m2/L²，解得ω=√(G(m1+m2)/L³)，周期T=2π/ω=2π√(L³/G(m1+m2))，故答案为A。'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
id: 'hq3',
|
|||
|
|
difficulty: 'hard',
|
|||
|
|
number: 3,
|
|||
|
|
points: 20,
|
|||
|
|
text: '一物体在地球表面的重量为G，若将该物体移至距离地心4R的位置（R为地球半径），则它的重量变为：',
|
|||
|
|
options: [
|
|||
|
|
{ id: 'hq3-a', label: 'A', text: 'G/4' },
|
|||
|
|
{ id: 'hq3-b', label: 'B', text: 'G/8' },
|
|||
|
|
{ id: 'hq3-c', label: 'C', text: 'G/16' },
|
|||
|
|
{ id: 'hq3-d', label: 'D', text: 'G/2' }
|
|||
|
|
],
|
|||
|
|
explanation: '正确答案：C<br>解析：重量即物体受到的重力，根据万有引力公式G=GMm/r²，当距离地心由R变为4R时，重力变为原来的1/16，故答案为C。'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
id: 'hq4',
|
|||
|
|
difficulty: 'hard',
|
|||
|
|
number: 4,
|
|||
|
|
points: 20,
|
|||
|
|
text: '已知太阳质量为M，地球绕太阳做匀速圆周运动的轨道半径为r，万有引力常量为G。则地球绕太阳运动的动能为：',
|
|||
|
|
options: [
|
|||
|
|
{ id: 'hq4-a', label: 'A', text: 'GMm/2r' },
|
|||
|
|
{ id: 'hq4-b', label: 'B', text: 'GMm/r' },
|
|||
|
|
{ id: 'hq4-c', label: 'C', text: 'GMm/4r' },
|
|||
|
|
{ id: 'hq4-d', label: 'D', text: '2GMm/r' }
|
|||
|
|
],
|
|||
|
|
explanation: '正确答案：A<br>解析：地球绕太阳运动的向心力由万有引力提供：GMm/r²=mv²/r，动能Ek=1/2mv²=GMm/2r，故答案为A。'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
id: 'hq5',
|
|||
|
|
difficulty: 'hard',
|
|||
|
|
number: 5,
|
|||
|
|
points: 20,
|
|||
|
|
text: '某行星的质量是地球质量的4倍，半径是地球半径的2倍。一物体在地球表面的逃逸速度为v，则该物体在该行星表面的逃逸速度为：',
|
|||
|
|
options: [
|
|||
|
|
{ id: 'hq5-a', label: 'A', text: 'v' },
|
|||
|
|
{ id: 'hq5-b', label: 'B', text: '√2 v' },
|
|||
|
|
{ id: 'hq5-c', label: 'C', text: '2v' },
|
|||
|
|
{ id: 'hq5-d', label: 'D', text: '4v' }
|
|||
|
|
],
|
|||
|
|
explanation: '正确答案：B<br>解析：逃逸速度公式v=√(2GM/R)，行星的M是地球的4倍，R是地球的2倍，则v\'=√(2G·4M/2R)=√(4GM/R)=√2·√(2GM/R)=√2 v，故答案为B。'
|
|||
|
|
}
|
|||
|
|
];
|
|||
|
|
|
|||
|
|
// 跟踪测验状态
|
|||
|
|
const quizState = {
|
|||
|
|
currentDifficulty: 'medium', // 初始难度
|
|||
|
|
completedDifficulties: [],
|
|||
|
|
scores: {}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
// DOM元素
|
|||
|
|
const submitBtn = document.getElementById('submit-btn');
|
|||
|
|
const nextBtn = document.getElementById('next-btn');
|
|||
|
|
const navigationSection = document.getElementById('navigation');
|
|||
|
|
const navigationMessage = document.getElementById('navigation-message');
|
|||
|
|
const result = document.getElementById('result');
|
|||
|
|
const scoreValue = document.getElementById('score-value');
|
|||
|
|
const correctCount = document.getElementById('correct-count');
|
|||
|
|
const incorrectCount = document.getElementById('incorrect-count');
|
|||
|
|
const difficultyIndicator = document.querySelector('.difficulty-indicator');
|
|||
|
|
const questionSection = document.querySelector('.question-section');
|
|||
|
|
|
|||
|
|
// 获取难度名称 - 移到全局作用域
|
|||
|
|
function getDifficultyName(difficulty) {
|
|||
|
|
const names = {
|
|||
|
|
easy: '简单',
|
|||
|
|
medium: '中等',
|
|||
|
|
hard: '高级'
|
|||
|
|
};
|
|||
|
|
return names[difficulty] || difficulty;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 等待DOM加载完成
|
|||
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|||
|
|
// 渲染题目
|
|||
|
|
renderQuestions();
|
|||
|
|
|
|||
|
|
// 提交当前难度的答案
|
|||
|
|
submitBtn.addEventListener('click', function() {
|
|||
|
|
const currentAnswers = correctAnswers[quizState.currentDifficulty];
|
|||
|
|
const totalQuestions = Object.keys(currentAnswers).length;
|
|||
|
|
let score = 0;
|
|||
|
|
let correct = 0;
|
|||
|
|
let incorrect = 0;
|
|||
|
|
|
|||
|
|
// 检查所有问题的答案
|
|||
|
|
for (const [questionName, correctAnswer] of Object.entries(currentAnswers)) {
|
|||
|
|
const selectedOption = document.querySelector(`input[name="${questionName}"]:checked`);
|
|||
|
|
const questionNumber = questionName.substring(2); // 从mq1提取1
|
|||
|
|
const explanationElement = document.querySelector(`[data-difficulty="${quizState.currentDifficulty}"][data-question="${questionNumber}"] .question-explanation`);
|
|||
|
|
|
|||
|
|
// 显示解析
|
|||
|
|
explanationElement.style.display = 'block';
|
|||
|
|
|
|||
|
|
if (selectedOption) {
|
|||
|
|
const userAnswer = selectedOption.value;
|
|||
|
|
|
|||
|
|
// 标记正确或错误
|
|||
|
|
if (userAnswer === correctAnswer) {
|
|||
|
|
score += 20; // 每题20分
|
|||
|
|
correct++;
|
|||
|
|
selectedOption.closest('.option').style.backgroundColor = '#e8f5e9';
|
|||
|
|
selectedOption.closest('.option').style.borderColor = '#4caf50';
|
|||
|
|
} else {
|
|||
|
|
incorrect++;
|
|||
|
|
selectedOption.closest('.option').style.backgroundColor = '#ffebee';
|
|||
|
|
selectedOption.closest('.option').style.borderColor = '#c62828';
|
|||
|
|
// 标记正确答案
|
|||
|
|
const correctOption = document.querySelector(`input[name="${questionName}"][value="${correctAnswer}"]`);
|
|||
|
|
correctOption.closest('.option').style.backgroundColor = '#e8f5e9';
|
|||
|
|
correctOption.closest('.option').style.borderColor = '#4caf50';
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
// 未答题
|
|||
|
|
incorrect++;
|
|||
|
|
const questionElement = document.querySelector(`[data-difficulty="${quizState.currentDifficulty}"][data-question="${questionNumber}"]`);
|
|||
|
|
questionElement.style.border = '2px solid #ff9800';
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 保存当前难度得分
|
|||
|
|
quizState.scores[quizState.currentDifficulty] = {
|
|||
|
|
score: score,
|
|||
|
|
correct: correct,
|
|||
|
|
incorrect: incorrect
|
|||
|
|
};
|
|||
|
|
quizState.completedDifficulties.push(quizState.currentDifficulty);
|
|||
|
|
|
|||
|
|
// 显示当前难度结果
|
|||
|
|
scoreValue.textContent = score;
|
|||
|
|
correctCount.textContent = correct;
|
|||
|
|
incorrectCount.textContent = incorrect;
|
|||
|
|
result.style.display = 'block';
|
|||
|
|
|
|||
|
|
// 隐藏提交按钮
|
|||
|
|
submitBtn.style.display = 'none';
|
|||
|
|
|
|||
|
|
// 根据当前难度和得分决定下一步
|
|||
|
|
if (quizState.currentDifficulty === 'medium') {
|
|||
|
|
if (correct < 3) {
|
|||
|
|
// 中等难度答对少于3题，推荐简单难度
|
|||
|
|
showNavigation('您在中等难度题目中表现不佳，建议先完成简单难度题目来巩固基础。', 'easy');
|
|||
|
|
} else {
|
|||
|
|
// 中等难度答对3题及以上，推荐高级难度
|
|||
|
|
showNavigation('恭喜您完成中等难度题目！接下来挑战高级难度题目吧。', 'hard');
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
// 简单或高级难度完成后，显示最终结果
|
|||
|
|
showFinalResult();
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 显示导航信息
|
|||
|
|
function showNavigation(message, nextDifficulty) {
|
|||
|
|
navigationMessage.textContent = message;
|
|||
|
|
navigationSection.dataset.nextDifficulty = nextDifficulty;
|
|||
|
|
navigationSection.style.display = 'block';
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 开始下一组题目
|
|||
|
|
nextBtn.addEventListener('click', function() {
|
|||
|
|
const nextDifficulty = navigationSection.dataset.nextDifficulty;
|
|||
|
|
if (!nextDifficulty) return;
|
|||
|
|
|
|||
|
|
// 更新当前难度
|
|||
|
|
quizState.currentDifficulty = nextDifficulty;
|
|||
|
|
|
|||
|
|
// 隐藏导航和结果
|
|||
|
|
navigationSection.style.display = 'none';
|
|||
|
|
result.style.display = 'none';
|
|||
|
|
|
|||
|
|
// 显示提交按钮
|
|||
|
|
submitBtn.style.display = 'inline-block';
|
|||
|
|
|
|||
|
|
// 更新难度指示器
|
|||
|
|
difficultyIndicator.textContent = `当前难度：${getDifficultyName(nextDifficulty)}`;
|
|||
|
|
difficultyIndicator.className = `difficulty-indicator difficulty-${nextDifficulty}`;
|
|||
|
|
|
|||
|
|
// 隐藏所有题目
|
|||
|
|
document.querySelectorAll('.question').forEach(question => {
|
|||
|
|
question.classList.add('hidden');
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 显示下一组题目
|
|||
|
|
document.querySelectorAll(`[data-difficulty="${nextDifficulty}"]`).forEach(question => {
|
|||
|
|
question.classList.remove('hidden');
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 滚动到页面顶部
|
|||
|
|
window.scrollTo(0, 0);
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 显示最终结果
|
|||
|
|
function showFinalResult() {
|
|||
|
|
// 计算总分
|
|||
|
|
let totalScore = 0;
|
|||
|
|
let totalCorrect = 0;
|
|||
|
|
let totalIncorrect = 0;
|
|||
|
|
|
|||
|
|
for (const difficulty of quizState.completedDifficulties) {
|
|||
|
|
totalScore += quizState.scores[difficulty].score;
|
|||
|
|
totalCorrect += quizState.scores[difficulty].correct;
|
|||
|
|
totalIncorrect += quizState.scores[difficulty].incorrect;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 更新结果显示
|
|||
|
|
scoreValue.textContent = totalScore;
|
|||
|
|
correctCount.textContent = totalCorrect;
|
|||
|
|
incorrectCount.textContent = totalIncorrect;
|
|||
|
|
result.style.display = 'block';
|
|||
|
|
|
|||
|
|
// 显示完成信息
|
|||
|
|
navigationMessage.textContent = '恭喜您完成所有推荐题目！';
|
|||
|
|
navigationSection.style.display = 'block';
|
|||
|
|
document.getElementById('next-btn').style.display = 'none';
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 渲染题目函数
|
|||
|
|
function renderQuestions() {
|
|||
|
|
// 清空题目区域
|
|||
|
|
questionSection.innerHTML = '';
|
|||
|
|
|
|||
|
|
// 按难度分组题目
|
|||
|
|
const questionsByDifficulty = {};
|
|||
|
|
quizQuestions.forEach(question => {
|
|||
|
|
if (!questionsByDifficulty[question.difficulty]) {
|
|||
|
|
questionsByDifficulty[question.difficulty] = [];
|
|||
|
|
}
|
|||
|
|
questionsByDifficulty[question.difficulty].push(question);
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 为每个难度创建题目
|
|||
|
|
Object.keys(questionsByDifficulty).forEach(difficulty => {
|
|||
|
|
questionsByDifficulty[difficulty].forEach((question, index) => {
|
|||
|
|
// 创建题目元素
|
|||
|
|
const questionElement = document.createElement('div');
|
|||
|
|
questionElement.className = 'question';
|
|||
|
|
questionElement.dataset.difficulty = question.difficulty;
|
|||
|
|
questionElement.dataset.question = question.number;
|
|||
|
|
|
|||
|
|
// 如果不是中等难度，添加隐藏类
|
|||
|
|
if (question.difficulty !== 'medium') {
|
|||
|
|
questionElement.classList.add('hidden');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 创建题目HTML结构
|
|||
|
|
let optionsHTML = '';
|
|||
|
|
question.options.forEach(option => {
|
|||
|
|
optionsHTML += `
|
|||
|
|
<div class="option">
|
|||
|
|
<input type="radio" id="${option.id}" name="${question.id}" value="${option.label}">
|
|||
|
|
<label for="${option.id}">${option.label}. ${option.text}</label>
|
|||
|
|
</div>
|
|||
|
|
`;
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
questionElement.innerHTML = `
|
|||
|
|
<div class="question-header">
|
|||
|
|
<span class="question-number">第${question.number}题</span>
|
|||
|
|
<span class="question-points">(${question.points}分)</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="question-text">${question.text}</div>
|
|||
|
|
<div class="question-options">
|
|||
|
|
${optionsHTML}
|
|||
|
|
</div>
|
|||
|
|
<div class="question-explanation" style="display: none;">
|
|||
|
|
${question.explanation}
|
|||
|
|
</div>
|
|||
|
|
`;
|
|||
|
|
|
|||
|
|
// 添加到题目区域
|
|||
|
|
questionSection.appendChild(questionElement);
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
}
|