1. 程式人生 > >簡易的商品統計

簡易的商品統計

href nbsp element document art back () NPU tag

參考https://blog.csdn.net/freya_yyy/article/details/80283894

<ul id="list">
    <li>
        <input type="button" value="-"/>
        <strong>0</strong>
        <input type="button" value="+"/>單價:
        <em>12.5</em>小計:<span>0</span></li>
    <
li> <input type="button" value="-"/> <strong>0</strong> <input type="button" value="+"/>單價: <em>10</em>小計:<span>0</span></li> </ul> <p>商品合計共:<em>0件</em>,共花費了:<em>0元</em>,其中最貴的商品單價是:<
strong>0元</strong></p>
<script type="text/javascript">
    window.onload=function(){
        var op=document.getElementsByTagName(p)[0];
        var pStrong=op.getElementsByTagName(strong)[0];
        var pEm=op.getElementsByTagName(em);

        var olist=document.getElementById(
list); var oli=olist.getElementsByTagName(li); for(var i=0;i<oli.length;i++){ count(oli[i]); } function count(ali){ var oBtn=ali.getElementsByTagName(input); var aStrong=ali.getElementsByTagName(strong)[0]; var aEm=ali.getElementsByTagName(em)[0]; var aSpan=ali.getElementsByTagName(span)[0]; var n1=parseInt(aStrong.innerHTML); var n2=parseFloat(aEm.innerHTML); function fn(){ var sum1=0;//累計數量 var sum2=0;//累計總價 var max=0;//用於求最大單價 for(var i=0;i<oli.length;i++){ var strongs=oli[i].getElementsByTagName(strong)[0]; var spans=oli[i].getElementsByTagName(span)[0]; var em=oli[i].getElementsByTagName(em)[0]; sum1+=parseInt(strongs.innerHTML); sum2+=parseFloat(spans.innerHTML); if(max<parseFloat(em.innerHTML)){max=parseFloat(em.innerHTML);} pEm[0].innerHTML=sum1+; pEm[1].innerHTML=sum2+; pStrong.innerHTML=max+; } } oBtn[0].onclick=function(){ n1--; if(n1<0){n1=0;} aStrong.innerHTML=n1; aSpan.innerHTML=n1*n2; fn(); } oBtn[1].onclick=function(){ n1++; aStrong.innerHTML=n1; aSpan.innerHTML=n1*n2; fn(); } } } </script>

簡易的商品統計