js代码简单实现购物车数量增加减少价格跟着增加

好的，以下是一个简单的实现：

HTML部分：

<div class="product">
    <div class="name">商品名称：XXX</div>
    <div class="price">价格：100元</div>
    <div class="quantity">
        <button class="minus">-</button>
        <span class="count">0</span>
        <button class="plus">+</button>
    </div>
</div>

JavaScript部分：

// 获取所有商品元素
const products = document.querySelectorAll('.product');

// 循环遍历每个商品元素
products.forEach(product => {
  // 获取该商品的加减按钮、数量和价格元素
  const minusBtn = product.querySelector('.minus');
  const plusBtn = product.querySelector('.plus');
  const countEl = product.querySelector('.count');
  const priceEl = product.querySelector('.price');

  // 获取商品的单价
  const price = parseInt(priceEl.textContent.split('：')[1]);

  // 初始化商品数量为0
  let count = 0;

  // 点击加号按钮时，增加商品数量并计算总价
  plusBtn.addEventListener('click', () => {
    count++;
    countEl.textContent = count;
    priceEl.textContent = `价格：${price * count}元`;
  });

  // 点击减号按钮时，减少商品数量并计算总价，但数量不得小于0
  minusBtn.addEventListener('click', () => {
    if (count > 0) {
      count--;
      countEl.textContent = count;
      priceEl.textContent = `价格：${price * count}元`;
    }
  });
});

这段代码实现了一个简单的购物车，当点击加号按钮时，商品数量和总价都会增加；当点击减号按钮时，商品数量和总价都会减少。注意，商品数量不得小于0。