Как распарсить массив json

113
18 февраля 2022, 10:00

Есть массив:

{
  "title_ru": Мидуэй,
  "year": "2019",
  "genres": [
    {
      "id": 10752,
      "name": "военный"
    },
    {
      "id": 36,
      "name": "история"
    },
    {
      "id": 28,
      "name": "боевик"
    },
    {
      "id": 18,
      "name": "драма"
    }
  ]
}

Как мне вытащить имена из GENRES через JQUERY? Не зннаю как выводить вложенные массивы

html

<div class="load">загрузить</div>
<div class="title"></div>
<div class="year"></div>
<div class="genre"></div>

js

$(".load").click(function() {
    $.ajax({
        url: "https://api.themoviedb.org/3/movie/522162?api_key=b6592428d620b6b47652d24b2242e898&language=ru-RU",
        dataType: 'json',
        success: function (result) {
            var title_ru = result["title"],
            year = result["release_date"].substring(0, 4),
            genre = result["genres"];
            $('.title').text(title_ru);
            $('.year').text(year);
            $('.genre').text(genre)
        }
    });
});

https://jsfiddle.net/dowjsz0L/

Answer 1

Ну, jQuery нацелен на удобную работу с элементами страницы. Для таких задачек нужно изучать массивы и объекты в самом JS ( json различие '{' от '[' ). В jQuery нет особых фишек для этого.

let title_ru = "Мидуэй"; 
let year = 2019; 
let genres = [ 
  {"id": 10752, "name": "военный"}, 
  {"id": 36, "name": "история"}, 
  {"id": 28,"name": "боевик"}, 
  {"id": 18,"name": "драма"} 
]; 
 
/**************/ 
 
$('.title').text( title_ru ); 
$('.year').text( year ); 
 
let links = createLinks( genres ).join(", "); 
$('.genre').html( links ); 
 
function createLinks(genres){ 
  return genres.map( item => { 
    return `<a href="http://example.com?bubu=${ item.id }">${ item.name }</a>`; 
     
    // Берет каждый объект из genres и подменяет его на созданную строку. 
  }); 
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
 
<div class="title"></div> 
<div class="year"></div> 
<div class="genre"></div>

P.s. знак $ в строке не имеет отношения к jQ. Это встроенная фишка для строк с обратными кавычками. По-умному называется "интерполяция".

P.P.s. item => item.id то же самое, что function (item) { return item.id }, называется "стрелочная функция"

READ ALSO
Как удалить пробелы перед текстом

Как удалить пробелы перед текстом

Нужно пройтись по массиву translates и удалить все пробелы перед началом текста или если в тесте одни пробелы то удалить их все и чтобы была просто...

99
decimal to bin странно работает

decimal to bin странно работает

мучался, мучался, родил этот кодесли убрать условие в главной функции(не рекурсии), то после цифры 16 конвертер работает некорректно(его нужно...

95
Выделение активного якоря с половины высоты экрана

Выделение активного якоря с половины высоты экрана

В данном примере выделение активного якоря активируется когда секция располагается по верхнему краю экранаА как можно сделать, чтобы якорь...

239
Как сделать скрипт для поля пароля. JavaScript [закрыт]

Как сделать скрипт для поля пароля. JavaScript [закрыт]

Хотите улучшить этот вопрос? Добавьте больше подробностей и уточните проблему, отредактировав это сообщение

151