Parse JSON от URL с Javascript

Question

Я собрал систему для анализа JSON и рендеринга его с помощью некоторого простого CSS. Хотя, я сделал это, используя переменную. Я не хочу выводить данные в скрипт. Вместо этого соберите его с локального или удаленного URL.

<script type='text/javascript'> 
$(window).load(function(){ 
var data={"users":[ 
     { 
      "title":"Dieter Rams Video", 
      "content":"Only text will go here. Limited to 100 characters per panel.", 
      "url":"http://website.me/video.php?=89697976996", 
     }, 
     { 
      "title":"IoT Ecosystem", 
      "content":"Villalobos", 
      "url":"http://google.com", 
     }, 
     { 
      "title":"IoT Ecosystem", 
      "content":"Villalobos", 
      "url":"http://google.com", 
     }, 
     { 
      "title":"IoT Ecosystem", 
      "content":"Villalobos", 
      "url":"http://google.com", 
     }, 
     { 
      "title":"IoT Ecosystem", 
      "content":"Villalobos", 
      "url":"http://google.com", 
     }, 
     { 
      "title":"IoT Ecosystem", 
      "content":"Villalobos", 
      "url":"http://google.com", 
     }, 
     { 
      "title":"IoT Ecosystem", 
      "content":"Villalobos", 
      "url":"http://google.com", 
     } 
]} 
$(data.users).each(function() { 
    var output = "<a href='" + this.url + "'><div class='col-sm-12'><div class='panel panel-default'><div class='panel-body'><h4>" + this.title + "</h4><p>" + this.content + "</p></div></div></div></a>"; 
    $('#feed').append(output); 
}); 
}); 
</script> 

Как я могу собрать данные JSON из источника URL и выводить его, как сейчас?

Update

<script type='text/javascript'> 
    var data; 
    $.ajax({ 
    dataType: "json", 
    url: `file://${__dirname}/data.json`, 
    data: data, 
    success: function(data) { 
     data = data; 
     } 
    }); 
    $(window).load(function(){ 
    $(data).each(function() { 
     var output = "<a href='" + this.url + "'><div class='col-sm-12'><div class='panel panel-default'><div class='panel-body'><h4>" + this.title + "</h4><p>" + this.content + "</p></div></div></div></a>"; 
     $('#feed').append(output); 
    }); 
    }); 
</script> 

Answer 1

Вы должны использовать Ajax (как правило, с JQuery):

var jsonResult; 

$.ajax({ 
    dataType: "json", 
    url: url, 
    data: data, 
    success: function(data) { 
     jsonResult = data; 
    } 
}); 

Ссылка: https://api.jquery.com/jquery.ajax/

Answer 2

Использование JQuery вы можете использовать $ .getJSON

Ссылка http://api.jquery.com/jquery.getjson/

Answer 3

Вы можете использовать метод jQuery.getJSON() для получения данных JSON с внешнего ресурса.

См. Документацию: http://api.jquery.com/jquery.getjson/