当前位置: 首页 > news >正文

node解析Excel中的考试题并实现在线做题功能

1、背景

        最近公司安排业务技能考试,下发excel文件的题库,在excel里查看并不是很方便,就想着像学习驾考题目一样,一边看一边做,做完之后可以查看正确答案。

2、开始分析需求

题目格式如下图

        需求比较简单,解析出 .xlsx 文件的每一行,第一列是题目类型,第二列为题干,第三列是选项,第四列是 正确答案。其中第三列再用 ' ' 或者 '/n' 去 分割一下选项应该就可以了

3、实现功能

        引入  node-xlsx 和 fs 。 使用 node-xlsx 解析出 .xlsx 文件 。并生成json 用 fs 生成js文件保存 json。 这里解析数据的功能就实现了

var xlsx = require('node-xlsx');
const fs = require('fs');
var obj = xlsx.parse('./test.xlsx');
obj = obj[0].data 
// console.log(obj)
let orightData = []
for(var i=0;i<obj.length;i++) {console.log("第"+(i+1)+"行的数据:");orightData.push({type: obj[i][0],question: obj[i][1],options: obj[i][2],answer: obj[i][3],})
}// console.log(orightData)let jsonData = JSON.stringify(orightData);
jsonData = 'let res = ' + jsonData
fs.writeFile('data.js', jsonData, (err) => {if (err) throw err;console.log('JSON data is saved.');
});

运行代码

node index.js

生成js文件 如下

let res = [{"type":"类型","question":"题目","options":"选项","answer":"答案"},{"type":"选择题","question":"域名MH.BIT.EDU.CN中主机名是(A)","options":"A、MH     B、EDU    C、CN    D、BIT","answer":"A"},{"type":"选择题","question":"根据《企业财务会计报告条例》的规定,企业对外提供虚假财务会计报告,可以对企业()。","options":"A. 直接责任人员处以2000元以上10000元以下罚款\n\nB. 处以100000元以上300000元以下罚款\n\nC. 处以5000元以上100000元以下罚款\n\nD. 处以2000元以上20000元以下罚款","answer":"B"}]

接下来就比较简单了,把数组循环 显示到页面上就行了。我这里就用js直接拼接字符串 设置body 的 innerHTML 就可以了。配合添加class 来显示 答案。再美化一下样式。代码如下

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<script src="./data.js"></script>
<body><div class="conteng"><p class="question"></p><p class="options"></p><p class="viewAnswer" onclick="viewAnswer(this)">点击查看答案</p><p class="answer"></p></div>
</body>
<script>
console.log(res);
let html = ''
res.forEach((el,index) => {if(el.question?.length > 10){el.options = el.options.replace(/\n/g,' ')el.options = el.options.split(' ').join('<i></i>')html += '<div class="conteng">'+'<p class="question">'+'<span class="type">['+el.type+']</span>'+(index)+'、'+el.question+'</p>'+'<p class="options">'+el.options+'</p>'+'<a class="" onclick="viewAnswer(this)">查看答案</a>'+'<p class="answer">【'+el.answer+'】</p>'+'</div>'}});
document.getElementsByTagName('body')[0].innerHTML = html
function viewAnswer(that){that.className = 'viewAnswer'
}
</script>
<style>a{color: cadetblue;font-size: 13px;cursor: pointer;display: inline-block;margin-left: 40px;border-radius: 6px;text-align: center;line-height: 18px;color: #FFFFFF;background: #3388FF;cursor: pointer;padding: 5px 12px;}i{display: block;width: 10px;height: 1px;}.type{color:#3388FF}.options{color: #657180;font-size: 14px;padding-left: 60px;}.answer{visibility: hidden;}.viewAnswer + .answer{visibility: visible;padding-left: 40px;}
</style>
</html>

执行完 node index.js 之后 双击打开index.html文件就可以了。效果如下图 

最后:

暂时先处理 单选题,其他题型处理逻辑大同小异。

相关文章:

node解析Excel中的考试题并实现在线做题功能

1、背景 最近公司安排业务技能考试&#xff0c;下发excel文件的题库&#xff0c;在excel里查看并不是很方便&#xff0c;就想着像学习驾考题目一样&#xff0c;一边看一边做&#xff0c;做完之后可以查看正确答案。 2、开始分析需求 题目格式如下图 需求比较简单&#xff0c;…...

怎么降低美国服务器硬盘故障率?

要降低硬盘故障率&#xff0c;首先需要了解其产生的原因&#xff0c;常见的美国服务器硬盘故障原因包括温度过高、振动过大、电流不稳定、质量问题等。对于美国服务器而言&#xff0c;由于其运行环境可能存在差异&#xff0c;如温湿度变化大、电力供应不稳定等&#xff0c;这些…...

Java---后端事务管理

代码世界聚眸光&#xff0c;昼夜敲盘思绪长。 算法心间精构建&#xff0c;编程路上细思量。 屏前架构乾坤定&#xff0c;键上飞驰智慧扬。 默默耕耘成果现&#xff0c;创新科技铸辉煌。 目录 一&#xff0c;概念 二&#xff0c;Spring事务管理 三&#xff0c;rollbackFor事务回…...

Leetcode 3223. Minimum Length of String After Operations

Leetcode 3223. Minimum Length of String After Operations 1. 解题思路2. 代码实现 题目链接&#xff1a;3223. Minimum Length of String After Operations 1. 解题思路 这一题还是比较简单的&#xff0c;其实就是想明白对于任何一个字符&#xff0c;如果其个数在3个或以…...

oops使用笔记

oops-plugin-excel-to-json 使用 gitee上的文档图片不可见 参考 > https://forum.cocos.org/t/topic/156800 配置&#xff0c;打开“项目设置”,拖动到最下面&#xff0c;有一个"Excel to Json",前3项采用默认配置吧Excel, 默认的Excel目录是与assets平级的excel目…...

redistemplate介绍与演示

redistemplate是一个用于在Redis中存储和检索数据的模板库。它提供了一组简单易用的函数和接口&#xff0c;使开发者能够更方便地使用Redis进行数据操作。 使用redistemplate&#xff0c;你可以实现以下功能&#xff1a; 存储和检索数据&#xff1a;redistemplate提供了存储和…...

代谢组数据分析(十五):基于python语言构建PLS-DA算法构建分类模型

介绍 本教程描述了一个具有二元分类结果的研究的典型代谢组学数据分析工作流程。主要步骤包括: 从Excel表格导入代谢物和实验数据。基于汇总QC的数据清洗。利用主成分分析可视化来检查数据质量。两类单变量统计。使用偏最小二乘判别分析(PLS-DA)进行多变量分析,包括: 模型…...

任务3 git基础知识(主要是pr的笔记)

任务要求 https://github.com/InternLM/Tutorial/blob/camp3/docs/L0/Git/task.md 文档 https://github.com/InternLM/Tutorial/blob/camp3/docs/L0/Git/readme.md 任务 任务1&#xff1a;提交PR https://github.com/InternLM/Tutorial/pull/1242 任务2&#xff1a;实践…...

三相PWM整流器滞环电流控制仿真matlab simulink

1、内容简介 略 88-可以交流、咨询、答疑 2、内容说明 略 三相&#xff30;&#xff37;&#xff2d;整流器已广泛应用工业与电气控制领域电流控制技术决定着三相&#xff30;&#xff37;&#xff2d;整流器系统的控制性能。综合比 较了各种电流控制方法应用较多的滞环比较…...

AVL树超详解上

前言 学习过了二叉树以及二叉搜索树后&#xff08;不了解二叉搜索树的朋友可以先看看这篇博客&#xff0c;二叉搜索树详解-CSDN博客&#xff09;&#xff0c;我们在一般情况下对于二叉搜索树的插入与查询时间复杂度都是O(lgN)&#xff0c;是十分快的&#xff0c;但是在一些特殊…...

spring boot 实现token验证登陆状态

1、添加maven依赖到pom.xml <dependency><groupId>io.jsonwebtoken</groupId><artifactId>jjwt-api</artifactId><version>0.11.5</version></dependency><dependency><groupId>io.jsonwebtoken</groupId>…...

【.NET全栈】ASP.NET开发Web应用——用户控件和绘图

文章目录 前言一、用户控件1、创建用户控件2、使用用户控件3、在web.config中注册用户控件4、用户控件中公开属性5、用户控件事件6、动态加载用户控件 二、动态绘图1、基本绘图2、绘制一个自定义的图片3、在Web页面放置自定义图片4、图片格式和质量5、一个Web绘图示例程序 前言…...

一行Python代码实现数据清洗的18种方法

目录 1. 去除字符串两边空格 2. 转换数据类型 3. 大小写转换 4. 移除列表中的重复元素 5. 快速统计元素出现次数 6. 字符串分割成列表 7. 列表合并 8. 数据填充 9. 提取日期时间 10. 字符串替换 11. 快速排序 12. 提取数字 13. 空值处理&#xff08;假设是列表&am…...

Java API练习 (1) (2024.7.20)

Date类 package APIExercise20240720; import java.util.Date; // 导包&#xff0c;Date是util下的 public class Date20240720 {public static void main(String[] args) {Date nowTime new Date(); // 得到当前系统时间System.out.println(nowTime);Date startTime new Da…...

JavaScript之WebAPIs-BOM

目录 BOM操作浏览器一、Window对象1.1 BOM&#xff08;浏览器对象模型&#xff09;1.2 定时器-延时函数1.3 js执行机制1.4 location对象1.5 navigator对象1.6 history对象 二、本地存储三、补充数组中的map方法数组中的join方法数组中的forEach方法(重点)数组中的filter方法(重…...

Math Reference Notes: 数学思想和方法

文章目录 1. 数学思想1.1 数形结合思想1.2 转化思想1.3 分类讨论思想1.4 整体思想 2. 数学方法2.1 配方法2.2 因式分解法2.3 待定系数法2.4 换元法2.5 构造法2.6 等积法2.7 反证法2.8 判别式法 1. 数学思想 1.1 数形结合思想 定义&#xff1a;将数与形&#xff08;代数与几何…...

Spring Cloud GateWay(4.1.4)

介绍 该项目提供了一个建立在 Spring 生态系统之上的 API 网关&#xff0c;包括&#xff1a;Spring 6、Spring Boot 3 和 Project Reactor。Spring Cloud Gateway 旨在提供一种简单而有效的方法来路由到 API&#xff0c;并为其提供跨领域关注点&#xff0c;例如&#xff1a;安…...

基于PHP+MYSQL开发制作的趣味测试网站源码

基于PHPMYSQL开发制作的趣味测试网站源码。可在后台提前设置好缘分&#xff0c; 自己手动在数据库里修改数据&#xff0c;数据库里有就会优先查询数据库的信息&#xff0c; 没设置的话第一次查询缘分都是非常好的 95-99&#xff0c;第二次查就比较差 &#xff0c; 所以如果要…...

【微信小程序】wx.navigateTo传参时不能使用const定义的数据类型

2024年7月21日更新 今日调试时发现似乎是因为使用vant-weapp时按照官方提示关闭了style:"v2"导致的此情况&#xff0c;打开之后无法复现该内容&#xff0c;特此提示。 以下是原内容 如题&#xff0c;笔者测试了好久才找到这个bug&#xff0c;想传递的数据是this.d…...

【Android studio环境搭建】Android studio连接夜神模拟器

Android studio连接夜神模拟器 一、 步骤 1.下载好Android Studio和夜神模拟器, 2.打开夜神模拟器&#xff0c;找到其安装目录下的 nox_adb.exe文件 3.右键进入cmd命令打开&#xff0c;管理员权限执行下面命令 PS D:\Program Files\Nox\bin> .\nox_adb.exe connect 127.…...

【力扣数据库知识手册笔记】索引

索引 索引的优缺点 优点1. 通过创建唯一性索引&#xff0c;可以保证数据库表中每一行数据的唯一性。2. 可以加快数据的检索速度&#xff08;创建索引的主要原因&#xff09;。3. 可以加速表和表之间的连接&#xff0c;实现数据的参考完整性。4. 可以在查询过程中&#xff0c;…...

《从零掌握MIPI CSI-2: 协议精解与FPGA摄像头开发实战》-- CSI-2 协议详细解析 (一)

CSI-2 协议详细解析 (一&#xff09; 1. CSI-2层定义&#xff08;CSI-2 Layer Definitions&#xff09; 分层结构 &#xff1a;CSI-2协议分为6层&#xff1a; 物理层&#xff08;PHY Layer&#xff09; &#xff1a; 定义电气特性、时钟机制和传输介质&#xff08;导线&#…...

《Playwright:微软的自动化测试工具详解》

Playwright 简介:声明内容来自网络&#xff0c;将内容拼接整理出来的文档 Playwright 是微软开发的自动化测试工具&#xff0c;支持 Chrome、Firefox、Safari 等主流浏览器&#xff0c;提供多语言 API&#xff08;Python、JavaScript、Java、.NET&#xff09;。它的特点包括&a…...

家政维修平台实战20:权限设计

目录 1 获取工人信息2 搭建工人入口3 权限判断总结 目前我们已经搭建好了基础的用户体系&#xff0c;主要是分成几个表&#xff0c;用户表我们是记录用户的基础信息&#xff0c;包括手机、昵称、头像。而工人和员工各有各的表。那么就有一个问题&#xff0c;不同的角色&#xf…...

srs linux

下载编译运行 git clone https:///ossrs/srs.git ./configure --h265on make 编译完成后即可启动SRS # 启动 ./objs/srs -c conf/srs.conf # 查看日志 tail -n 30 -f ./objs/srs.log 开放端口 默认RTMP接收推流端口是1935&#xff0c;SRS管理页面端口是8080&#xff0c;可…...

ServerTrust 并非唯一

NSURLAuthenticationMethodServerTrust 只是 authenticationMethod 的冰山一角 要理解 NSURLAuthenticationMethodServerTrust, 首先要明白它只是 authenticationMethod 的选项之一, 并非唯一 1 先厘清概念 点说明authenticationMethodURLAuthenticationChallenge.protectionS…...

04-初识css

一、css样式引入 1.1.内部样式 <div style"width: 100px;"></div>1.2.外部样式 1.2.1.外部样式1 <style>.aa {width: 100px;} </style> <div class"aa"></div>1.2.2.外部样式2 <!-- rel内表面引入的是style样…...

OpenLayers 分屏对比(地图联动)

注&#xff1a;当前使用的是 ol 5.3.0 版本&#xff0c;天地图使用的key请到天地图官网申请&#xff0c;并替换为自己的key 地图分屏对比在WebGIS开发中是很常见的功能&#xff0c;和卷帘图层不一样的是&#xff0c;分屏对比是在各个地图中添加相同或者不同的图层进行对比查看。…...

AI书签管理工具开发全记录(十九):嵌入资源处理

1.前言 &#x1f4dd; 在上一篇文章中&#xff0c;我们完成了书签的导入导出功能。本篇文章我们研究如何处理嵌入资源&#xff0c;方便后续将资源打包到一个可执行文件中。 2.embed介绍 &#x1f3af; Go 1.16 引入了革命性的 embed 包&#xff0c;彻底改变了静态资源管理的…...

论文笔记——相干体技术在裂缝预测中的应用研究

目录 相关地震知识补充地震数据的认识地震几何属性 相干体算法定义基本原理第一代相干体技术&#xff1a;基于互相关的相干体技术&#xff08;Correlation&#xff09;第二代相干体技术&#xff1a;基于相似的相干体技术&#xff08;Semblance&#xff09;基于多道相似的相干体…...