试卷

HTML练习――试卷

---

网页基本骨架：表单
卷头排版：表格(两行三列)
单选框

<input type="radio">

复选框

<input type="checkbox">

文本框

<input type="text">

多行文本框

<textarea rows="10" cols="100">

文本框内提示文字：placeholder属性
文本框内预填文字：value属性
单选框/复选框选中：checked

样图

DOM练习――计算总分

---

任务：

• 根据用户选择计算分数
• 编写测试检查分数计算结果的正确性

思路:
Part1:计算

首先定义一个变量sorce储存成绩值。
试卷一共有五道题，可以分为以下三类：

• 一、五：填空题
  →if语句对比文本框内填入的值和标准值，若相同，则把分值加到sorce上
• 二、四：单选题
  →把同一个题目底下的单选框设置成同样的name值以保证只能选择一个选项
  →检查正确答案是否被选择，若是，则把对应分值加到sorce上
• 三：多选题
  →给两个错误选项设置相同class值传入数组①，六个正确选项设置相同class值传入数组②
  →设置一个for循环遍历数组①，用if语句判断数组①中的元素是否都未被选择。若是，跳出循环，否则进入第二个循环
  →设置第二个循环遍历数组②，引入一个计数变量num，用if语句判断数组②中的正确选项被选择。若是，num自增。
  →用if语句判断num的值，若num＝3，则说明对了一道题，若num=6，则说明对了两道题，给sorce加上对应分值

Part2:测试

应该编一个js文件，通过改变节点的值改变总分，把对应的正确总分与程序计算出来的总分比较，若相同则测试通过，若不同则测试失败。

• 测试一
  Input：改变第一题某文本框的值
  Expect：95
• 测试二
  Input：改变第五题文本框的值
  Expect：80
• 测试三
  Input：改变第二题某题被checked的选项
  Expect：90
• 测试四
  Input：改变第四题某题被checked的选项
  Expect：90
• 测试五
  Input：第三题某题少选一个正确答案（不够）
  Expect：90
• 测试六
  Input：第三题某题在选上了全部正确答案的基础上选了一个错误答案（多选or错选）
  Expect：90

遇到的问题及解决

问题1：编好了函数之后计算结果一直为0
解决：只根据思路写了函数，但是没有在被点击事件调用的函数中调用自己写的函数，然后调用了函数就豁然开朗啦~

问题2：每点击一次就调用一次函数，sorce的值就加倍
解决：设置了一个开关，刷新一次页面只允许提交一次
本来想要在提交后清空表单内容，但遍历表单元素对我还有一定难度，也不可能再在HTML中加一个按钮清空表单

问题3：有一个函数一直计算不出正确答案
解决：表示一直以为是程序逻辑错误，把js文件改来改去改了一个多小时都没啥用，然后把代码发给大佬，人家告诉我我的HTML文件里把class写成了clsss，所以根本就没有获取到内容，囧-_-||

囧

问题4：改上面那个其实没什么问题的函数的时候，利用断点调试有一个明明定义了的局部变量一直显示unavailable
解决：我没有透彻的掌握断点，不会设置停止，然后……唉没有然后，囧+10086

中国好同学