数组按字段排序，动态添加

最新推荐文章于 2021-06-29 17:07:09 发布

瑞瑞小同学

最新推荐文章于 2021-06-29 17:07:09 发布

阅读量177

点赞数

本文链接：https://blog.csdn.net/yr123456654321/article/details/103256663

版权

var profecialArr=[];
var colorArr=["#2340DF","#E51C23","#23B7DF","#0FAA1B","#FF9800"]
console.log(colorArr[2])
$.ajax({
    url:"./js/index.json",
    type:"post",
    dataType:"json",
    success:function (result) {
        profecialArr=result.data;
        var ortarr= profecialArr.sort(compare('data'))
        profestr(ortarr,"#firrow");
    },
});

function compare(property){
    return function(a,b){
        var value1 = a[property];
        var value2 = b[property];
        return value2 - value1;
    }
}

//职业比例字符串拼接
function profestr(data,partId) {
    var str='';
    var z=0;
    for(var i=0;i<data.length;i++){
        str+=`
        <div class="itembox">
            <span class="item">
                <div>${data[i].name}</div>
                <div>${data[i].data}</div>
            </span>
        </div>
    `
    }
    $(partId).html(str);
   //动态添加背景颜色 
    var colorArrTemp = colorArr;
    for (var i=0;i< Math.ceil((data.length/colorArrTemp.length)); i++){
        colorArrTemp = colorArrTemp.concat(colorArr)
    }
    for(var j=0;j<data.length;j++){
       $(partId).find(".item").eq(j).css("background",colorArrTemp[j])

    }

}