Question

我有以下数组：

"facilities":[
  {
    "name": "Gratis",
    "id": "FACILITYCATEGORYFREE",
    "facilities":[
       {"name": "Free city maps", "id": "FREECITYMAPS"},
       {"name": "Free parking", "id": "FREEPARKING"},
       {"name": "Free Wifi", "id": "FREEWIFI"}
    ]
  }
]

我需要将免费设施附加到＆＃34; ul＆＃34;按特定顺序：

免费wifi
免费城市地图

我有以下内容：

for (i =0; i < json.facilities[0].facilities.length; i++) {
  $("#facilities").append("<li class='fa fa-check'><span>" + json.facilities[0].facilities[i].name + "</span></li>");
}

然而，这只会根据它们在数组中的位置进行打印

我已尝试过但尚未尝试过：

for (i =0; i < json.facilities[0].facilities.length; i++) {
  if(json.facilities[0].facilities[i].name.length && json.facilities[0].facilities[i].id === 'FREEWIFI'){
    $("#facilities").append("<li class='fa fa-check'><span>" + json.facilities[0].facilities[i].name + "</span></li>");
  }
  if (json.facilities[0].facilities[i].id === 'BREAKFASTINCLUDED') {
    $("#facilities").append("<li class='fa fa-check'><span>" + json.facilities[0].facilities[i].name + "</span></li>");
  }
  if (json.facilities[0].facilities[i].id === 'FREEINTERNETACCESS') {
    $("#facilities").append("<li class='fa fa-check'><span>" + json.facilities[0].facilities[i].name + "</span></li>");
  }
  if (json.facilities[0].facilities[i].id === 'TOWELSINCLUDED') {
    $("#facilities").append("<li class='fa fa-check'><span>" + json.facilities[0].facilities[i].name + "</span></li>");
  }
  if (json.facilities[0].facilities[i].id === 'LINENINCLUDED') {
    $("#facilities").append("<li class='fa fa-check'><span>" + json.facilities[0].facilities[i].name + "</span></li>");
  }
  if (json.facilities[0].facilities[i].id === 'FREECITYMAPS') {
    $("#facilities").append("<li class='fa fa-check'><span>" + json.facilities[0].facilities[i].name + "</span></li>");
  }
  if (json.facilities[0].facilities[i].id === 'FREEPARKING') {
    $("#facilities").append("<li class='fa fa-check'><span>" + json.facilities[0].facilities[i].name + "</span></li>");
  }
}

Answer 1

如果您不知道列表中有多少设施，您可以这样做：

id_order = ["FREEWIFI", "FREECITYMAPS"].reverse();
facility_cmp = function (a, b) {
    var a_idx = id_order.indexOf(a.id);
    var b_idx = id_order.indexOf(b.id);
    if (a_idx == b_idx) return 0;
    return (a_idx > b_idx) ? -1 : 1;
}

这是一个比较函数，您可以使用它来对数组进行排序，以便按正确的顺序为您提供设施。反之亦然，您可以以自然的方式指定ID，但是重新排序列表的顺序适用于排序不会出现在列表中的ID而不必具有索引的特殊情况 - 1。

你可以这样做：

var these_facilities = json.facilities[0].facilities
    .slice(0)               // get a copy of the array
    .sort(facilities_cmp);  // and sort it
these_facilities.forEach(function (facility) {  // forEach is easier IMHO than writing a for loop over .length
    $("#facilities").append("<li class='fa fa-check'><span>" + facility.name + "</span></li>");
});

Answer 2

如果你可以用不同的方式重新组织你的JSON，你可以做类似的事情;

"facilities":[
  {
    "name": "Gratis",
    "id": "FACILITYCATEGORYFREE",
    "facilities":{
       "FREECITYMAPS":{"name": "Free city maps"},
       "FREEPARKING":{"name": "Free parking"},
       "FREEWIKI":{"name": "Free Wifi"}
    }
  },
]

var firstLi = "<li class='fa fa-check'><span>" + json.facilities[0].facilities.FREEWIFI +"</span></li>"
var secondLi = "<li class='fa fa-check'><span>" + json.facilities[0].facilities.FREECITYMAPS +"</span></li>"
var thirdLi = "<li class='fa fa-check'><span>" + json.facilities[0].facilities.FREEPARKING +"</span></li>"

$("#facilities").append(firstLi + secondLi + thirdLi);

由于您无法编辑JSON，我们需要从这开始：

"facilities":[
  {
    "name": "Gratis",
    "id": "FACILITYCATEGORYFREE",
    "facilities":[
       {"name": "Free city maps", "id": "FREECITYMAPS"},
       {"name": "Free parking", "id": "FREEPARKING"},
       {"name": "Free Wifi", "id": "FREEWIFI"}
    ]
  },
]

你可以这样做：

var firstLi, secondLi, thirdLi = ""

for (var i = 0; i < json.facilities[0].facilities.length; i++){

  if (json.facilities[0].facilities[i].id === "FREEWIFI"){

    firstLi = "<li class='fa fa-check'><span>" + json.facilities[0].facilities[i].name +"</span></li>"

  }else if (json.facilities[0].facilities[i].id === "FREECITYMAPS"){

    var secondLi = "<li class='fa fa-check'><span>" + json.facilities[0].facilities[i].name +"</span></li>"

  }else if (json.facilities[0].facilities[i].id === "FREEPARKING"){

    var thirdLi = "<li class='fa fa-check'><span>" + json.facilities[0].facilities[i].name +"</span></li>"

  }
}

$("#facilities").append(firstLi + secondLi + thirdLi);

另一种可能的方式，因为array order is preserved你可以依赖于设施子数组的顺序并执行此操作：

if (json.facilities[0].facilities.length === 3){
  var firstLi = "<li class='fa fa-check'><span>" + json.facilities[0].facilities[2].name +"</span></li>"
  var secondLi = "<li class='fa fa-check'><span>" + json.facilities[0].facilities[0].name +"</span></li>"
  var thirdLi = "<li class='fa fa-check'><span>" + json.facilities[0].facilities[1].name +"</span></li>"
  $("#facilities").append(firstLi + secondLi + thirdLi)
}

对象数组返回与特定ID关联的标签

2 个答案: