私は数週間後にHTML/JavaScriptプロジェクトを開始する予定で、カート機能を作成する方法についています。私はカートの基本を選別しました。しかし、それは各単一の製品のための多くのコードであるようです。どのように配列やスクリプトを使ってローカルメモリにすべての製品を適切かつ効率的に格納することができるのかよく分かりませんが、どうやって最適なのかわかりません。これは私がこれまで持っているものです。複数の製品をローカルメモリに効率的に保存する方法
<!DOCTYPE html>
<html>
<head>
<body>
<p><button onclick="AddAMToCart()" type="button">Add AM to Cart</button></p>
<p><button onclick="AddSonicHighWaysToCart()" type="button">Add SonicHighWays to Cart</button></p>
<p><button onclick="AddHotelCaliforinaToCart()" type="button">Add HotelCaliforina to Cart</button></p>
<p><button onclick="AddFiddyCentToCart()" type="button">Add FiddyCent to Cart</button></p>
<br>
<p><button onclick="clearCart()" type="button">Clear Cart</button></p>
<div id="result"></div>
</body>
<script>
var AM = 3.50;
var SonicHighWays = 4.50;
var HotelCaliforina = 6.00;
var FiddyCent = 0.50;
function AddAMToCart() {
if (typeof(Storage) !== "undefined") {
if (localStorage.Cart) {
localStorage.Cart = Number(localStorage.Cart) + AM;
} else {
localStorage.Cart = 0;
}
document.getElementById("result").innerHTML = "Total Cost: " + localStorage.Cart;
}
}
function AddSonicHighWaysToCart() {
if (typeof(Storage) !== "undefined") {
if (localStorage.Cart) {
localStorage.Cart = Number(localStorage.Cart) + SonicHighWays;
} else {
localStorage.Cart = 0;
}
document.getElementById("result").innerHTML = "Total Cost: " + localStorage.Cart;
}
}
function AddHotelCaliforinaToCart() {
if (typeof(Storage) !== "undefined") {
if (localStorage.Cart) {
localStorage.Cart = Number(localStorage.Cart) + HotelCaliforina;
} else {
localStorage.Cart = 0;
}
document.getElementById("result").innerHTML = "Total Cost: " + localStorage.Cart;
}
}
function AddFiddyCentToCart() {
if (typeof(Storage) !== "undefined") {
if (localStorage.Cart) {
localStorage.Cart = Number(localStorage.Cart) + FiddyCent;
} else {
localStorage.Cart = 0;
}
document.getElementById("result").innerHTML = "Total Cost: " + localStorage.Cart;
}
}
function clearCart() {
localStorage.Cart = 0;
document.getElementById("result").innerHTML = "Total Cost: " + localStorage.Cart;
}
</script>
</head>
</html>