Я полный нуб на JS, я недавно начал играть с API и JS Так что, пожалуйста, потерпите меня. Теперь я пытался сделать это самостоятельно в течение последних трех дней, но после многих поисков, которые я все еще мог сделать, мне нужно было только заполнить данные в select
из HTML.
2 вопроса.
Q1. Мне удалось получить данные JSON, используя AJAX из API. ( с использованием AJAX, потому что я узнал, что браузеру не нужно обновлять sh для получения новых данных )
$(document).ready(function() {
getDataJson();
});
function getDataJson(ajaxurl) {
$.ajax({
method: "GET",
url: "https://corona.lmao.ninja/v2/jhucsse",
datatype: "json",
success: onSuccess,
error: onError
});
}
Далее я попытался заполнить выбор в моем HTML OnSuccess
function onSuccess(jsonReturn) {
$("#dropdown").empty();
//console.log(jsonReturn);
let dropdown = $('#dropdown');
dropdown.empty();
dropdown.append('<option selected="true" disabled>Choose Country</option>');
dropdown.prop('selectedIndex', 0);
// Populate dropdown with list of countries
$.each(jsonReturn, function (key, entry) {
dropdown.append($('<option></option>').attr('value', entry.data).text(entry.data));
});
var $dropdown = $('#dropdown'),
$objView = $('#objView'),
$docFragment = $(document.createDocumentFragment());
for (var prop in jsonReturn) {
$('<option/>', {
val: prop,
text: prop
}).appendTo($docFragment);
}
$dropdown.append($docFragment);
$dropdown.on('change', function() {
var objString = JSON.stringify(jsonReturn[$dropdown.val()]);
objString = objString.replace(/[\{\}\[\]\"]*/ig, ''); // Remove unwanted chars
objString = objString.replace(/\,/ig, '<br/>'); // Replace commas with new lines (i.e. br tags)
$objView.html(objString);
});
$dropdown.trigger('change');
}
//if JSON fails
function onError() {
$("#dropdown").html("i failed.");
}
И все заработало. Отлично. Но затем я попытался сделать следующий шаг, который хотел сделать, - когда я нажимаю на название страны, она должна отображать остальные ее JSON данные с именами и их значениями.
Как отображать JSON данные по клику с JavaScript это не точное, но достаточно близкое решение, но это совсем другое (трудное для меня) решение, которое я не мог понять.
в настоящее время мой выпадающий список выглядит следующим образом JSFIDDLE
Теперь я собираюсь сделать это Заполнить HTML Таблица определенными элементами из JSON Array
, но со всеми другими JSON данными, подобными этим, для каждой страны Как отображать JSON данные при клике с помощью JavaScript
Я буду очень признателен, если кто-то сможет наставьте меня с остальными сценариями или, может быть, с нуля, если есть какой-то простой / лучший способ сделать то, что я ожидаю, с понятным объяснением.
Q2. Как уменьшить задержку извлечения AJAX?
немного медленнее / медленнее, что я заметил даже с меньшим количеством данных. Или это просто нормально?
И если есть хороший способ начать обучение JS для новичков (site, tutes, et c ..), дайте мне знать.
Спасибо Заранее!