js实现购物车物品的增加
时间: 2023-11-18 18:04:49 浏览: 25
好的,下面是一个简单的 JavaScript 实现购物车物品增加的代码:
```javascript
// 获取加按钮元素
var addBtn = document.querySelector('.add-btn');
// 获取显示数量的元素
var quantityEl = document.querySelector('.quantity');
// 获取当前数量
var quantity = parseInt(quantityEl.innerText);
// 获取当前价格
var priceEl = document.querySelector('.price');
var price = parseFloat(priceEl.innerText);
// 获取总价元素
var totalPriceEl = document.querySelector('.total-price');
// 为加按钮添加点击事件
addBtn.addEventListener('click', function() {
// 增加数量
quantity++;
// 更新显示数量
quantityEl.innerText = quantity;
// 计算总价
var totalPrice = price * quantity;
// 更新总价元素
totalPriceEl.innerText = totalPrice.toFixed(2);
});
```
这段代码假设有一个加按钮元素,一个显示数量的元素,一个显示价格的元素和一个显示总价的元素。当加按钮被点击时,它会增加数量并更新显示数量和总价。