DOM操作实例 购物车 (4)

//计算商品的价格
function computeMoney() {
//总价 = 单价 x 数量
//1.获取所有商品的单价
var itemPrices = document.querySelectorAll(".item-money");
//2.所有商品的数量
var itemCounts = document.querySelectorAll(".show-num");
//商品总价
var sumMoney = 0;
//商品总数量
var sumCount = 0;
for (var i = 0; i < itemPrices.length; i++) {
//每个商品的价格和数量
var price = itemPrices[i].innerHTML - 0;
var count = itemCounts[i].value - 0;
sumCount += count;
//每个商品的总价
sumMoney += (price * count);
}
//计算均价 总价/总数量
var avgMoney = (sumMoney / sumCount);
//将获取到的总价和均价添加到页面上
var totalSpan = document.querySelector("#total-money");
var avgSpan = document.querySelector("#avg-money");
totalSpan.innerHTML = sumMoney;
//判断是否每一件商品的数量都为0
if (sumCount === 0) {
avgMoney = 0;
}
avgSpan.innerHTML = avgMoney.toFixed(2);
}

function computeSelectedMoney() {
//1.获取所有商品的单价
var itemPrices = document.querySelectorAll(".item-money");
//2.所有商品的数量
var itemCounts = document.querySelectorAll(".show-num");
//3.所有的商品勾选框
var itemChecks = document.querySelectorAll(".item-check");

//勾选的商品总价
var sumMoney = 0;
for (var i = 0; i < itemPrices.length; i++) {
//每个商品的价格和数量
if (itemChecks[i].checked) {
var price = itemPrices[i].innerHTML - 0;
var count = itemCounts[i].value - 0;
//每个商品的总价
sumMoney += (price * count);
}
}
console.log(sumMoney);
alert("勾选的商品总价为:" + sumMoney + "元");
}
</script>
</html>

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zwfzgs.html