HTML5手機購物車是一種非常方便的在線購物工具,它可以幫助用戶在移動設備上輕松地添加商品,瀏覽購物車和結賬。下面是一個基本的HTML5購物車代碼。
<!DOCTYPE html>
<html>
<head>
<title>HTML5購物車</title>
</head>
<body>
<h1>我的購物車</h1>
<div id="cart">
<ul id="items">
<li data-id="001" data-name="T恤" data-price="25.00">T恤: ¥25.00</li>
<li data-id="002" data-name="牛仔褲" data-price="50.00">牛仔褲: ¥50.00</li>
<li data-id="003" data-name="襯衫" data-price="35.00">襯衫: ¥35.00</li>
</ul>
<p id="total">總價: ¥0.00</p>
<button id="checkout">結賬</button>
</div>
<script src="jquery.min.js"></script>
<script src="shopping_cart.js"></script>
</body>
</html>
代碼中包括一個div元素來表示購物車,在其中有一個ul元素表示商品列表,每一個li元素則代表一個商品,用"data-id"、"data-name"和"data-price"這些自定義屬性來存儲商品信息。總價以及結賬按鈕可以通過p元素和button元素進行實現。此外,還需要引用jQuery庫和一個簡單的JavaScript腳本(shopping_cart.js),來實現購物車的功能。