简化代码以查看JSON中是否还存在数组中的数字

时间:2018-06-21 15:32:16

标签: jquery html json ajax

在此下方我有一个ajax调用...

  1. 从URL中获取JSON
  2. 在DOM中,从href和抓取URL的最后部分(数字)。 将它们推入数组
  3. 如果该数字同时存在于数组和JSON中,请执行某些操作

我现在想做的是简化代码,所以我不必再添加if / else了,因为JSON可能会更长。我想我有一个大概的主意(如下),但不确定如何正确执行它。

感谢您的帮助!

当前的ajax调用

$.ajax({
      type: "GET",
      url: "https://api.myjson.com/bins/mossa",
      success: function(data){
            Data = data;

            $.each(Data, function(key, val){

                // create array
                var myArray = [];

                $('#someContainer ul li').each(function() {
                    // grabs the URL and extracts the numbers at the end
                    var url = $(this).find('a').attr('href'),
                        parts = url.split("/"),
                    last_part = parts[parts.length-2];

                    // insert the number(s) into an array
                    myArray.push(last_part);
                });

                // if 12023 is in the JSON and array, do something
                if (myArray.indexOf('12023') > -1) {

                    relCat3 = val['12023']['relatedCategory'];

                    //Create grid of related cat
                    $.each(relCat3, function(k, v){
                        $('.newContainer').html('<div class="grid_2"><img src="'+v['relCat1Image']+'" alt=""><a href="'+v['relCat1URL']+'">'+v['relCat1Name']+'</a></div>');
                    });

                // if 12017 is in the JSON and array, do something
                } else if (myArray.indexOf('12017') > -1) {

                    relCat9 = val['12017']['relatedCategory'];

                    //Create grid of related cat
                    $.each(relCat9, function(k, v){
                        $('.newContainer').html('<div class="grid_2"><img src="'+v['relCat1Image']+'" alt=""><a href="'+v['relCat1URL']+'">'+v['relCat1Name']+'</a></div>');
                    });

                }

            });

        } 

   });

新代码的大致构想

$.ajax({
      type: "GET",
      url: "https://api.myjson.com/bins/mossa",
      success: function(data){
            Data = data;

            $.each(Data, function(key, val){

              // create array
              var myArray = [];

              $('#someContainer ul li').each(function() {
                // grabs the URL and extracts the numbers at the end
                var url = $(this).find('a').attr('href'),
                  parts = url.split("/"),
                  last_part = parts[parts.length-2];

                  // insert the number(s) into an array
                  myArray.push(last_part);
              });

              // if newVar is in the JSON and array, do something
              if (myArray.indexOf(newVar) > -1) {

                relCat = val[newVar]['relatedCategory'];

                //Create grid of related cat
                $.each(relCat, function(k, v){
                    $('.newContainer').html('<div class="grid_2"><img src="'+v['relCat1Image']+'" alt=""><a href="'+v['relCat1URL']+'">'+v['relCat1Name']+'</a></div>');
                  });

              }

            });

        } 

   });

JSON(可以更新)

[  
   {  
      "12023":{  
         "relatedCategory":[  
            {  
               "relCat1Name":"bed skirts",
               "relCat1URL":"http://www.google.com",
               "relCat1Image":"https://dummyimage.com/146/000/fff.jpg\u0026text=3-image-1",
               "relCat2Name":"duvet covers",
               "relCat2URL":"http://www.google.com",
               "relCat2Image":"https://dummyimage.com/146/000/fff.jpg\u0026text=3-image-2",
               "relCat3Name":"throw pillows",
               "relCat3URL":"http://www.google.com",
               "relCat3Image":"https://dummyimage.com/146/000/fff.jpg\u0026text=3-image-3",
               "relCat4Name":"comforters, quilts and bedspreads",
               "relCat4URL":"http://www.google.com",
               "relCat4Image":"https://dummyimage.com/146/000/fff.jpg\u0026text=3-image-4"
            }
         ]
      },
      "12017":{  
         "relatedCategory":[  
            {  
               "relCat1Name":"shams",
               "relCat1URL":"http://www.google.com",
               "relCat1Image":"https://dummyimage.com/146/000/fff.jpg\u0026text=9-image-1",
               "relCat2Name":"down and down alternatives",
               "relCat2URL":"http://www.google.com",
               "relCat2Image":"https://dummyimage.com/146/000/fff.jpg\u0026text=9-image-2",
               "relCat3Name":"bed skirts",
               "relCat3URL":"http://www.google.com",
               "relCat3Image":"https://dummyimage.com/146/000/fff.jpg\u0026text=9-image-3",
               "relCat4Name":"throw pillows",
               "relCat4URL":"http://www.google.com",
               "relCat4Image":"https://dummyimage.com/146/000/fff.jpg\u0026text=9-image-4"
            }
         ]
      }
   }
]

0 个答案:

没有答案