Я пытаюсь построить сайт статуса трубки, идея состоит в том, чтобы отображать статус каждой линии трубки (хороший сервис, небольшие задержки и т. Д.)
Сначала я хотел отобразить все и раскраситьзакодируйте ответы, чтобы все, кроме «хорошего обслуживания», было бы красным текстом.
Вместо этого я хотел бы скрыть весь div, если это хороший сервис.Это означает, что вы увидите только те трубки, которые не имеют ответа «Good Service»
У меня одинаковый код для каждой линии трубки, но я просто показываю 1 пример ниже
Здесьтакое javascript
$.getJSON ('https://api.tfl.gov.uk/Line/central/Status?
detail=false&app_id=APIID&app_key=APIKEY',
function(data) { console.log(data);
$.each(data, function (index, value) {
console.log(value);
var statuscentral = value.lineStatuses[0].statusSeverityDescription;
console.log(statuscentral);
$('.statuscentral').text(statuscentral);
if (statuscentral != "Good Service") {
tube.classList.add("noShow");
}
});
});
Не уверен, что полезно включить, но вот HTML
<div class="tube">
<span class="central"></span>
<h2 class="tube-title">Central</h2>
<h3 class="statuscentral"></h3>
</div>
И это CSS
/* create 3 equal columns that floats next to each other */
.tube {
float: left;
width: 33%;
padding-bottom: 50px;
display: inline-block;
}
/* styles for tube span */
.central {
background-color: #ED462F;
}
/* hides div */
.noShow {
display: none;
}