16届蓝桥杯

1.元素周期表/* TODO 待补充代码 Start*/ /* 根据题意先用flex布局使元素周期表横向排列 */ .container .table { display: flex; } /* 再用题意的var函数写出一格的margin-top */ .container .table .interval1 { margin-top: var(--interval); } /* 这里需要三格margin-top所以要用calc函数 */ .container .table .interval3 { margin-top: calc(var(--interval) * 3); } /* TODO End */2.每日签到JS控制DOM元素并使用到了日期类// TODO:请补充代码 // 先给signInBtn绑定一个点击事件 signInBtn.addEventListener(click, function () { // 获取当前系统的时间 const time new Date().getDate() // 获取daysBox中所有的日期 const p daysBox.querySelectorAll(p) // 用forEach遍历全部的p p.forEach(item { // 用parseInt把日期字符串转化为整数 // 用if语句判断给与系统日期相符的日期添加active类 if (parseInt(item.innerHTML) time) { item.classList.add(active) } }) // 给signInBtn添加no-active类 signInBtn.classList.add(no-active) // 秀修改signInBtn的文本 signInBtn.innerHTML 明天也要记得来哦 }) // TODO:END3.你还在等我吗JS中localStorage函数和setTimeout函数的使用setItem(key, value, expired) { // TODO 待补充代码 // 存储key和value localStorage.setItem(key, value) // 使用延迟执行函数达到在有效时长后清除数据 setTimeout(function () { localStorage.removeItem(key) }, expired) } getItem(key) { // TODO 待补充代码 // 返回获取的数据 return localStorage.getItem(key) } removeItem(key) { // TODO 待补充代码 // 删除数据 localStorage.removeItem(key) }4.地址识别JS正则表达式要记一下常见的正则表达式function parseContactInfo(text) { // TODO: 请补充代码 // 将字符串按空格分割为几个数组 split( )是把空格作为分割符 let result text.split( ) // 定义正则表达式 const reg1 /^[\u4e00-\u9fa5]{2,4}$/ const reg2 /\d{11}$/ const reg3 /^[\u4e00-\u9fa5][A-Za-z0-9\u4e00-\u9fa5]{3,}$/ //声明变量 let name let phone let address // 使用for循环遍历切割后的数组将符合条件的赋值给对应的 for (let i 0; i result.length; i) { // .test() 检测一个字符串是否符合当前的正则 if (reg1.test(result[i])) { name result[i] } else if (reg2.test(result[i])) { phone result[i] } else if (reg3.test(result[i])) { address result[i] } } // 返回解析的数组 return {name: name, phone: phone, address: address} }5. 文本自动生成器 (看不懂题目)JS递归function compose(...middlewares) { // TODO : 待补充代码 // 返回一个新函数initalValue是中间件传输的初始值callback被调用的最终结尾函数 return (initalValue, callback) { // 用index代表当前执行到第几个中间件index 0 代表第一个中间件 let index 0 // 定义next函数 function next (str) { // 更新当前传递值 initalValue str // 判断是否还有未执行的中间件 if (index middlewares.length) { // 取出下一个要执行的中间件函数 const fn middlewares[index] // 标记执行过的中间件 index // 执行当前中间件函数 fn (initalValue, next) } else { // 没有中间件就返回最终结尾的函数 callback(initalValue) } } // 开启第一个中间件 // 判断是否传入至少一个中间件 if (middlewares.length 0) { // 取出第一个要执行的中间件函数 const firstFn middlewares[0] // 给索引号1 index // 执行第一个中间件函数 firstFn (initalValue, next) } else { // 如果是一个空数组,中间返回最终结尾的函数 callback (initalValue) } } }7.企业微信会议助手// 目标1 const fetchMeetingData async () { // TODO: 待补充代码 // fetch 向本地./js/meetings.json文件发起 GET 请求获取原始响应对象 // .then(res res.json()) // 将响应体解析为JSON形式得到JS对象 return fetch(./js/meetings.json).then(res res.json()).then(res { // 从JSON中提取title/time/location组装成对象存入 meeting.value { title: res.title, time: res.time, location: res.location } // 直接将JSON中的participants数组存入 participants.value res.participants }) }; const formatDate (dateStr) { // TODO: 待补充代码 // if语句避免传入空值时出问题 if(dateStr){ // 将日期按照-拆分为数组 let [year,month,day] dateStr.split(-); // 如果月份/日期的长度不足2就在前面加0 if(month.length2) month 0month; if(day.length2) day 0day; // 返回符合格式的字符串 return year-month-day } };// 目标2 !-- TODO: 待补充代码 -- tr v-foritem in participants td{{item.name}}/td tdspan :classstatusClass(item.status){{item.status}}/span/td /tr const statusClass (status) { // TODO: 待补充代码 // 用if判断接收参数status表示参会状态 // 返回与状态对应的CSS类名字符串 if (status 待确认) { return status-pending }; if (status 已接受) { return status-ready }; if (status 已拒绝) { return status-declined } };// 目标3 function myAllSettled(promises) { // TODO: 待补充代码 // 不能使用 Promise.allSettled, Promise.allPromise.race 等方法 return new Promise((resolve, reject) { // 初始化变量 // res 存储每个Promise的执行结果 // cnt 记录已完成的Promise数量 let res [], cnt 0; // 遍历Promise数组 promises.forEach((item,index) { // 给当前Promise注册成功回调 item.then((result) { // 将成功结果存入结果数组的对应位置 res[index] result cnt ; // 判断是否所有Promise都已完成 if (cnt promises.length) // 全部完成后,调用resolve并返回结果数组res resolve(res); }); }) }); }