💻 代码预览 · 小草卤肉店

1<!DOCTYPE html>
2<html lang="zh-CN">
3<head>
4<meta charset="UTF-8"/>
5<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"/>
6<title>限时秒杀拼团 · 小草卤肉店</title>
7<link rel="stylesheet" href="style.css"/>
8</head>
9<body>
10
11<header class="header"><a class="back" onclick="history.back()">‹</a><h1>限时秒杀拼团</h1><span class="right"></span></header>
12<div class="flash-hero">
13  <div class="fh-title">⚡ 限时秒杀 · 整点开抢</div>
14  <div class="fh-count">距本场结束 <b>02</b>:<b>18</b>:<b>40</b></div>
15</div>
16<div class="section-title">🔥 秒杀专场</div>
17<div id="seckillList"></div>
18<div class="section-title">👥 拼团更划算</div>
19<div id="groupList"></div>
20
21
22<nav class="tabbar"><a class="" href="index.html"><span class="icon">🏠</span>首页</a><a class="" href="category.html"><span class="icon">🍖</span>卤味</a><a class=" active" href="vip.html"><span class="icon">👑</span>会员</a><a class="" href="orders.html"><span class="icon">📦</span>订单</a><a class="" href="mine.html"><span class="icon">👤</span>我的</a></nav>
23<script src="data.js"></script>
24<script>
25  var sl = document.getElementById('seckillList');
26  var h = '';
27  window.DATA.seckills.forEach(function (s) {
28    h += '<div class="seckill-card"><div class="sc-img">' + s.img + '</div><div class="sc-body">'
29      + '<div class="sc-name">' + s.name + '</div>'
30      + '<div class="sc-price">¥' + s.price + '<small>¥' + s.old + '</small></div></div>'
31      + '<div class="sc-btn">' + s.btn + '</div></div>';
32  });
33  sl.innerHTML = h;
34  var gl = document.getElementById('groupList');
35  var h2 = '';
36  window.DATA.groups.forEach(function (g) {
37    h2 += '<div class="group-card"><div class="gc-head"><div class="gc-img">' + g.img + '</div>'
38      + '<div class="gc-name">' + g.name + '</div><div class="gc-price">' + g.price + '</div></div>'
39      + '<div class="gc-foot"><div class="gc-need"><b>' + g.need + '</b> 人成团 · 已拼 ' + g.joined.toLocaleString() + ' 件</div>'
40      + '<div class="gc-btn" data-toast="已开团，等待好友参团">去开团</div></div></div>';
41  });
42  gl.innerHTML = h2;
43</script>
44<script src="app.js"></script>
45</body>
46</html>