jQuery: Получение данных json, метод getJSON

Библиотека jQuery также предоставляет специальный метод getJSON. Этот метод отправляет на сервер GET-запрос и в ответ получает данные json.

Подключаем библиотеку:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

Например, у нас определен такой файл users.json:

{
  "users": [{
    "id" : 1,
    "name": "Bill Gates",
    "age": 43
  }, {
    "id" : 2,
    "name": "Sergey Brin",
    "age": 33
  }, {
    "id" : 3,
    "name": "Larry Page",
    "age": 34
  }]
}

Попробуем вывести его в табличку на странице:

<table id="users">
  <tr><td>Id</td><td>Имя</td><td>Возраст</td><tr>
</table>
<script type="text/javascript">
$(function(){
  $.getJSON('users.json', function(data) {
      for(var i=0;i<data.users.length;i++){
        $('#users').append('<tr><td>' + data.users[i].id + '</td><td>' + data.users[i].name + 
        '</td><td>' + data.users[i].age + '</td><tr>');
      }
  });
});
</script>