当当购物车

/**
 * 加一
 */
function onPlus() {
    // 获取所有加节点，给每个加节点绑定事件
    var plusArr = document.querySelectorAll('input[name="plus"]')
    for (var i = 0; i < plusArr.length; i++) {
        plusArr[i].onclick = function () {
            //原来的数量加一
            // 1. 获取数量节点元素
            var amountEle = this.previousElementSibling
            // 2. 原来数量值
            var amount = amountEle.value
            // 3. 数量加一
            amount++
            // 4. 加一后数量值重新赋值给节点元素
            amountEle.value = amount

            var minusEle = amountEle.previousElementSibling

            //5.移除disabled作用：让减号可用
            minusEle.removeAttribute('disabled') 

            //6. 计算单个商品总价
            //6.1 获取商品单价
            var singlePriceEle = this.parentElement.previousElementSibling
            var singlePrice = singlePriceEle.innerHTML
            singlePrice = singlePrice.substring(1)
            //6.2计算商品总价
            singleTotalPrice = singlePrice * amount 
            //6.3获取单个商品总价节点
            var totalEle = this.parentElement.nextElementSibling
            totalEle.innerHTML = `￥${singleTotalPrice.toFixed(2)}` 
        
            //7.计算总价
            getTotalPrice()
        }
    }
}

/**
 * 减一
 */
function onMiuns() {
    var minusArr = document.querySelectorAll('input[name="minus"]')
    for (var i = 0; i < minusArr.length; i++) {
        minusArr[i].onclick = function () {
            //获取数量节点元素
            var amountEle = this.nextElementSibling
            var amount = amountEle.value //获取数量节点元素原来的值
            amount-- //数量减一

            //边界检查
            if(amount <= 0){
                //减数量不可用
                this.setAttribute('disabled',true) //添加disabled作用： 让减号不可用
            }
            amountEle.value = amount //减一后的数量重新赋值给数量节点元素

        }
    }
}

/**
 * 计算所有商品总价
 *   获取所有单个商品总价累加求和
 */
function getTotalPrice(){
    var minusArr = document.querySelectorAll('input[name="minus"]')
    var totalPrice = 0 //所有商品总价
    for(var i = 0; i<minusArr.length; i++){
        //获取单个商品总价
        var singleEle = minusArr[i].parentElement.nextElementSibling
        var singlePrice = singleEle.innerHTML
        singlePrice = singlePrice.substring(1)
        totalPrice = totalPrice + Number(singlePrice)
    }

    var spanPriceEle = document.querySelector('.total-price')
    spanPriceEle.innerHTML = `￥${totalPrice.toFixed(2)}` 

}


onPlus()
onMiuns()