2 façons d'obtenir des données json de manière asynchrone avec jQuery_jquery

Les exemples de cet article décrivent deux façons pour jQuery d'obtenir des données json de manière asynchrone, ce qui est d'une grande valeur pratique dans le développement de programmes Web. Partagez-le avec tout le monde pour votre référence. La méthode spécifique est la suivante :

De manière générale, il existe deux façons pour jQuery d'obtenir des données json de manière asynchrone, l'une est la méthode $.getJSON et l'autre est la méthode $.ajax. Cet article utilisera ces deux méthodes pour obtenir des données json de manière asynchrone, puis les ajoutera à la page.

Créez le fichier data.json dans le répertoire racine :

{
  "one" : "Hello",
  "two" : "World"
}

1. Obtenez des données json via la méthode $.getJSON

  <script src="Scripts/jquery-2.1.1.min.js"></script>
  <script type="text/javascript">
    $(function() {
      $.getJSON('data.json', function(data) {
        var items = [];
        $.each(data, function(key, val) {
          items.push('<li id="' + key + '">' + val + '</li>');
        });
        $('<ul/>', {
          'class': 'list',
          html: items.join('')
        }).appendTo('body');
      });
    });
  </script>

2. Obtenez des données json via la méthode $.ajax

  <script src="Scripts/jquery-2.1.1.min.js"></script>
  <script type="text/javascript">
    $(function() {
      $.ajax({
        url: 'data.json',
        dataType: 'json',
        success: function(data) {
          var items = [];
          $.each(data, function(key, val) {
            items.push('<li id="' + key + '">' + val + '</li>');
          });
          $('<ul/>', {
            'class': 'list',
            html: items.join('')
          }).appendTo('body');
        },
        statusCode: {
          404: function() {
            alert("没有找到相关文件~~");
          }
        }
      });
    });
  </script>

Résumé : L'utilisation de la méthode $.getJSON et de la méthode $.ajax peut obtenir le même effet. Cependant, si vous souhaitez avoir un contrôle plus détaillé sur le processus d'acquisition asynchrone, il est recommandé d'utiliser le $. méthode ajax.

Je crois que ce qui est décrit dans cet article a une certaine valeur de référence pour la programmation jQuery de chacun.