模仿秒杀倒计时功能

weixin_49596018

于 2020-11-01 13:39:55 发布

阅读量173

点赞数

本文链接：https://blog.youkuaiyun.com/weixin_49596018/article/details/109424930

版权

本文介绍了如何创建一个网页秒杀倒计时功能，包括预期的效果展示，以及对应的HTML和JavaScript代码实现细节。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、效果
在这里插入图片描述
二、HTML代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>秒杀倒计时</title>
</head>

<body>
    <!-- 预设框架结构 -->
   <!-- <section>
       <div></div>
       <div></div>
       <div>
           <span>20</span>
           <span>：00场 场倒计时</span>
       </div>
       <div>
           <span>01</span>
           <span>：</span>
           <span>33</span>
           <span>：</span>
           <span>50</span>
       </div>
   </section> -->
   
   <script src="./index.js"></script>
</body>
</html>

三、JS代码块

let secEle = document.createElement("section");
secEle.style.width = "300px";
secEle.style.height = "400px";
secEle.style.backgroundColor = "red";
let bodyEle = document.getElementsByTagName("body"

最低0.47元/天解锁文章