列表

详情


FED84. 倒计时

描述

倒计时是web开发中常见的组件,请完成second和render两个函数,完成倒计时的显示部分
1、second函数的输入为整数,返回{day: Int, hour: Int, min: Int, second: Int}
2、render函数的输入为second函数的输出,将数据在页面对应的DOM元素上显示出来,格式如html所示
3、如果day为0,隐藏对应的DOM元素,否则显示(请直接使用已经实现的css代码)
4、数值不足两位,前面补充0

原站题解

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-28

{"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-11

{"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":[]}

上一题