BD9. 倒计时
描述
倒计时是web开发中常见的组件,请完成second和render两个函数,完成倒计时的显示部分HTML/CSS/JavaScript 解法, 执行用时: 887ms, 内存消耗: 77880KB, 提交时间: 2020-12-23
{"css":".hide{\n\tdisplay: none;\n}","js":"function second(second) {\n var res,\n diff;\n res = {};\n diff = new Date(second*1000);\n res.day = diff.getUTCDate() - 1;\n res.hour = diff.getUTCHours();\n res.min = diff.getUTCMinutes();\n res.second = diff.getUTCSeconds();\n return res;\n}\nfunction render(data) {\n var daySpan,\n hourSpan,\n minSpan,\n secSpan;\n daySpan = document.querySelector(\"#jsCountdown span:nth-child(1)\");\n hourSpan = document.querySelector(\"#jsCountdown span:nth-child(2)\");\n minSpan = document.querySelector(\"#jsCountdown span:nth-child(3)\");\n secSpan = document.querySelector(\"#jsCountdown span:nth-child(4)\");\n if (data.day === 0) {\n daySpan.setAttribute(\"class\", \"hide\");\n } else {\n daySpan.innerHTML = (data.day < 9 ? (\"0\"+data.day) : data.day) + \"天\";\n }\n hourSpan.innerHTML = (data.hour < 9 ? (\"0\"+data.hour) : data.hour) + \":\";\n minSpan.innerHTML = (data.min < 9 ? (\"0\"+data.min) : data.min) + \":\";\n secSpan.innerHTML = (data.second < 9 ? (\"0\"+data.second) : data.second);\n}","html":"<div id=\"jsCountdown\">\n <span>01天</span>\n <span>02:</span>\n <span>03:</span>\n <span>04</span>\n</div>","libs":[]}
HTML/CSS/JavaScript 解法, 执行用时: 956ms, 内存消耗: 77900KB, 提交时间: 2020-08-27
{"css":".hide{\n\tdisplay: none;\n}","js":" function second(second) {\n let min = parseInt(second / 60)\n let hour = parseInt(min / 60)\n let day = parseInt(hour / 24)\n second = second % 60\n min = min % 60\n hour = hour % 24\n return { day: day, hour: hour, min: min, second: second }\n }\n function render(data) {\n let doms = document.getElementById('jsCountdown').getElementsByTagName('span')\n let j = 0\n for (let i in data) {\n if (data[i] < 10) {\n data[i] = '0' + data[i]\n }\n if (i == 'day') {\n doms[j++].innerHTML = data[i] + '天'\n if (data.day == '00') {\n doms[0].className = 'hide'\n }\n } else if (i != 'second') {\n doms[j++].innerHTML = data[i] + ':'\n } else {\n doms[j++].innerHTML = data[i]\n }\n }\n }","html":"<div id=\"jsCountdown\">\n <span>01天</span>\n <span>02:</span>\n <span>03:</span>\n <span>04</span>\n</div>","libs":[]}
HTML/CSS/JavaScript 解法, 执行用时: 957ms, 内存消耗: 77880KB, 提交时间: 2021-06-28
{"css":".hide{\n\tdisplay: none;\n}","js":"function second(second) {\n let Second=parseInt(second%60);\n let Min=parseInt((second/60)%60);\n let Hour=parseInt((second/60/60)%24);\n let Day=parseInt(second/60/60/24)\n return {\n day: Day,\n hour: Hour,\n min: Min,\n second: Second \n }\n}\n\nfunction render(data) {\n let span=document.getElementById('jsCountdown').getElementsByTagName('span');\n let j=0;\n for(let key in data){\n data[key]=data[key]+'';\n if(data[key].length==1){\n data[key]='0'+data[key]\n }\n if(key=='day'){\n if(data[key]=='00'){\n span[j].className='hide' \n }\n span[j++].innerHTML=data[key]+'天'\n }\n if(key=='hour'){\n span[j++].innerHTML=data[key]+':'\n }\n if(key=='min'){\n span[j++].innerHTML=data[key]+':'\n }\n if(key=='second'){\n span[j++].innerHTML=data[key]\n }\n }\n \n \n \n}","html":"<div id=\"jsCountdown\">\n <span>01天</span>\n <span>02:</span>\n <span>03:</span>\n <span>04</span>\n</div>","libs":[]}
HTML/CSS/JavaScript 解法, 执行用时: 963ms, 内存消耗: 77880KB, 提交时间: 2020-07-08
{"css":".hide{\n\tdisplay: none;\n}","js":"function second(second) {\n var res,\n diff;\n res = {};\n diff = new Date(second*1000);\n res.day = diff.getUTCDate() - 1;\n res.hour = diff.getUTCHours();\n res.min = diff.getUTCMinutes();\n res.second = diff.getUTCSeconds();\n return res;\n}\n\nfunction render(data) {\n var node;\n node = document.getElementById(\"jsCountdown\");\n daySpan = node.children[0];\n hourSpan = node.children[1];\n minSpan = node.children[2];\n secSpan = node.children[3];\n if (data.day === 0) {\n daySpan.setAttribute(\"class\", \"hide\");\n } else {\n daySpan.innerHTML = (data.day < 9 ? (\"0\"+data.day) : data.day) + \"天\";\n }\n hourSpan.innerHTML = (data.hour < 9 ? (\"0\"+data.hour) : data.hour) + \":\";\n minSpan.innerHTML = (data.min < 9 ? (\"0\"+data.min) : data.min) + \":\";\n secSpan.innerHTML = (data.second < 9 ? (\"0\"+data.second) : data.second);\n}","html":"<div id=\"jsCountdown\">\n <span>01天</span>\n <span>02:</span>\n <span>03:</span>\n <span>04</span>\n</div>","libs":[]}
HTML/CSS/JavaScript 解法, 执行用时: 964ms, 内存消耗: 78244KB, 提交时间: 2021-07-10
{"css":".hide{\n\tdisplay: none;\n}","js":"function second(second) {\n return {\n day: Math.floor(second / (24 * 3600)),\n hour: Math.floor(second % (24 * 3600) / 3600),\n min: Math.floor(((second % (24 * 3600)) % 3600) / 60),\n second: Math.floor((((second % (24 * 3600)) % 3600) % 60) % 60)\n }\n}\n\nfunction render(data) {\n let nodeList = document.getElementsByTagName(\"span\");\n // 天\n if(data.day > 0){\n nodeList[0].innerText = (data.day < 9 ? \"0\" + data.day : data.day) + \"天\";\n }else{\n nodeList[0].classList.add(\"hide\");\n }\n // 小时\n nodeList[1].innerText = (\"0\" + data.hour).slice(-2) + \":\";\n // 分钟\n nodeList[2].innerText = (\"0\" + data.min).slice(-2) + \":\";\n // 秒钟\n nodeList[3].innerText = (\"0\" + data.second).slice(-2);\n}","html":"<div id=\"jsCountdown\">\n <span class=\"day\">01天</span>\n <span>02:</span>\n <span>03:</span>\n <span>04</span>\n</div>","libs":[]}