在编写页面列表时,有个动态添加元素的需求,需要按照元素的某个属性排序,如果当前元素存在,则直接修改用于标示个数的属性,否则需要按照元素的一个属性查找到合适的位置,新建元素并插入。
具体代码如下:
function updateHTMLInfor(jsonObj,divId,allDivId){
if(jsonObj.dataId!=null&&jsonObj.dataId>0){
var divDataId=divId+jsonObj.dataId;
var dataDiv=$("#"+divDataId);
if(dataDiv!=null)
{
var dataNum=dataDiv.attr('num');
if(dataNum!=null&&dataNum>0)
{
if(jsonObj.dataNum!=null&&jsonObj.dataNum>0){
if(jsonObj.dataName!=''&&jsonObj.dataName!=null){
dataNum=parseInt(dataNum)+parseInt(jsonObj.dataNum);
dataDiv.attr('num',dataNum);
var dataDivText=jsonObj.dataName+" "+dataNum;
dataDiv.text(dataDivText);
}
}
}else{
appendHTMLDiv(jsonObj,allDivId)
}
}
else{
appendHTMLDiv(jsonObj,allDivId)
}
}
}
function appendHTMLDiv(jsonObj,allDivId)
{
var allDataDiv=$("#"+allDivId);
var divHtml="<div class='css_class' price='"+jsonObj.dataPrice+"'>";
divHtml+="<div class='css_class1'><img src='"+jsonObj.dataUrl+"'"+ "alt='"+jsonObj.dataName+"' width='69' height='62'/> </div>";
divHtml+="<div id='data_"+jsonObj.dataId+"' num='"+jsonObj.dataNum+"' price='"+jsonObj.dataPrice+"' class='css_class2'>"+ jsonObj.dataName+" "+jsonObj.dataNum +"</div>";
divHtml+="</div>";
var newDataDiv=$(divHtml);
var price=jsonObj.dataPrice;
var dataDivArray=allDataDiv.children();
var insertDiv=null;
for(var i=0;i<dataDivArray.length;i++)
{
var dataPrice=dataDivArray[i].getAttribute("price");
if(dataPrice<price)
{
insertDiv=dataDivArray[i];
break;
}
}
if(insertDiv!=null)
{
newDataDiv.insertBefore(insertDiv);
}
else
{
allDataDiv.append(divHtml);
}
}