100以内加减法互动练习 - 知达AI助教 | 教育人工智能案例 | 教育人工智能社区

我想系统的做一个100以内的运算练习，里面包含两个主要分支，加法和减法，其中加法再分十以内加法（结果小于等于10）,整十数加个位数，20以内加法（结果小于等于19，也就是几加几等于十几），两位数加一位数（必须设计进位答案小于等于100），两位数和两位数的直加（不涉及进位），两位数加两位数进位加（必须涉及进位答案小于等于100）；减法分10以内减法（结果大于等于0）,20以内减法（必须涉及退位，也就是十几减几），两位数减一位数（必须涉及退位），整十数减个位数，两位数和两位数的直减（不涉及退位）两位数减两位数（必须涉及退位答案大于等于0）。要求孩子选择后可以开始，题目无限刷新每次提交后显示正确还是错误，方便孩子操作，可以设计成孩子点击数字拖拽到对应位数那种底下呈现0-9 孩子拖拽，界面要优化一些，卡通风，UI设计美观尽量适配各种分辨率每次计算
以下是一个满足你需求的HTML页面代码，包含加法和减法练习的所有分支。页面设计为卡通风，适合孩子操作，并支持拖拽数字完成计算。每次提交后会显示正确或错误，并且题目可以无限刷新。

代码生成中...

知达任务回放中

100以内加减法互动练习

代码

预览

138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
      const answerBox = document.getElementById('answer-box'
          );
      answerBox.innerHTML = '';
      if (type === 'addition') {
        currentQuestion = generateAdditionQuestion();
      } else if (type === 'subtraction') {
        currentQuestion = generateSubtractionQuestion();
      }
      document.getElementById('question').innerText = 
          `${currentQuestion.a} ${currentQuestion.operator} 
          ${currentQuestion.b} = ?`;
      const slots = Math.max(currentQuestion.answer.toString
          ().length, 2);
      for (let i = 0; i < slots; i++) {
        const slot = document.createElement('div');
        slot.className = 'digit-slot';
        slot.setAttribute('data-index', i);
        slot.addEventListener('click', () => focusSlot(slot
            ));
        answerBox.appendChild(slot);
      }
      const numberButtons = document.getElementById('number
          -buttons');
      numberButtons.innerHTML = '';
      for (let i = 0; i <= 9; i++) {
        const button = document.createElement('button');
        button.innerText = i;
        button.onclick = () => fillSlot(i);
        numberButtons.appe
 
 
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX