2018-07-15关于原生js的商品加减页面小demo

其中li为每个商品数目,li里的strong是商品数目,li里的em是商品单价,li里的input一个是减少数量,一个是增加数量,li里的span是该商品的总价,p为商品总合计,span是p的子元素,span0是商品总数,span1是总共价钱,span2为所选商品里最贵的一个,

var aLi = document.getElementsByTagName("li");

var aStrong = document.getElementsByTagName("strong");

var aEm = document.getElementsByTagName("em");

var oP = document.getElementsByTagName("p")[0];

var aSpan = oP.getElementsByTagName("span");

var number = 0;

var price = 0;

for(var i=0;i

Price(aLi[i]);

}

function Price(obj){

var aIn = obj.getElementsByTagName("input");

var oStrong = obj.getElementsByTagName("strong")[0];

var oEm = obj.getElementsByTagName("em")[0];

var oSpan = obj.getElementsByTagName("span")[0];

aIn[0].onclick = function(){

if(oStrong.innerHTML>0){

number--;

oStrong.innerHTML--;

price -= parseFloat(oEm.innerHTML);

oSpan.innerHTML = parseFloat(oEm.innerHTML)*oStrong.innerHTML + "元";

aSpan[0].innerHTML = number;

aSpan[1].innerHTML = price;

aSpan[2].innerHTML = getMax();

}

}

aIn[1].onclick = function(){

number++;

oStrong.innerHTML++;

price += parseFloat(oEm.innerHTML);

oSpan.innerHTML = parseFloat(oEm.innerHTML)*oStrong.innerHTML + "元";

aSpan[0].innerHTML = number;

aSpan[1].innerHTML = price;

aSpan[2].innerHTML = getMax();

}

}

function getMax(){

var arr = [];

for(var i=0;i

if(aStrong[i].innerHTML!=0){

arr.push(parseFloat(aEm[i].innerHTML));

}

}

return aStrong == 0 ? 0 : arr.sort(function(a,b){return b-a})[0];

}

你可能感兴趣的:(2018-07-15关于原生js的商品加减页面小demo)