【问题标题】:How can I filter json response with Ajax jQuery如何使用 Ajax jQuery 过滤 json 响应
【发布时间】:2021-10-28 22:16:08
【问题描述】:

我想用 Ajax 和 jQuery 过滤一个 json 并返回 2 个不同的数组。一个用于日期(例如 2021-08-29 17:00:00),一个用于温度。溶胶(例如 299.3)。

json 的结构应该以不同的方式完成,但我需要按原样使用它。如何过滤前 5 行并返回两个数组?

阿贾克斯

$.ajax({
  dataType: "json", 
  type: "GET",
  url: "https://www.infoclimat.fr/public-api/gfs/json?_ll=43.60426,1.44367&_auth=VkwDFAB%2BVnQALVRjDngELQRsAzZaLFJ1B3sBYgFvVisCZ1czA2QAYFY%2FVisOIQUwAy4EYA80AjlTNgZmXy1fI1Y3A24AZFY2AGxUNw47BC8EKAN%2BWmRSdQd7AWQBbFY3An9XMQNiAHxWOFYwDjsFLwMxBGUPOAIlUy8GYF80Xz9WNQNlAGpWMABtVDUOOgQvBCgDZVpkUmgHNwFjAWxWYQIwV2YDMgBrVj1WMw43BS8DNARkDzMCPVM0BmNfNF86VioDeAAaVkcAclR2DnwEZQRxA35aMFI0BzA%3D&_c=d2cc2bd980a89404afabf2e9b204309c", 
  success: function(json) {
    console.log(json);
  },
  // en cas d'erreur
  error : function(result, statut, error) {
    console.log(error);
  }
});

json 响应

{
    "request_state": 200,
    "request_key": "fd543c77e33d6c8a5e218e948a19e487",
    "message": "OK",
    "model_run": "14",
    "source": "internal:GFS:1",
    "2021-08-29 17:00:00": {
        "temperature": {
            "2m": 299.8,
            "sol": 299.3,
            "500hPa": -0.1,
            "850hPa": -0.1
        },
        "pression": {
            "niveau_de_la_mer": 101360
        },
        "pluie": 0,
        "pluie_convective": 0,
        "humidite": {
            "2m": 24
        },
        "vent_moyen": {
            "10m": 11.3
        },
        "vent_rafales": {
            "10m": 12
        },
        "vent_direction": {
            "10m": 335
        },
        "iso_zero": 4036,
        "risque_neige": "non",
        "cape": 0,
        "nebulosite": {
            "haute": 0,
            "moyenne": 0,
            "basse": 0,
            "totale": 0
        }
    },
    "2021-08-29 20:00:00": {
        "temperature": {
            "2m": 297.3,
            "sol": 298.5,
            "500hPa": -0.1,
            "850hPa": -0.1
        },
        "pression": {
            "niveau_de_la_mer": 101310
        },
        "pluie": 0,
        "pluie_convective": -0.1,
        "humidite": {
            "2m": 31.1
        },
        "vent_moyen": {
            "10m": 9.8
        },
        "vent_rafales": {
            "10m": 15.6
        },
        "vent_direction": {
            "10m": 311
        },
        "iso_zero": 4061,
        "risque_neige": "non",
        "cape": 0,
        "nebulosite": {
            "haute": 0,
            "moyenne": 0,
            "basse": 0,
            "totale": 0
        }
    },...

最终结果应该是2个数组:

labels = ["2021-08-29 20:00:00", "2021-08-29 20:00:00", "2021-08-29 23:00:00" ... ];
data = [299.3, 298.5, 294.2 ... ];

【问题讨论】:

  • 请添加您预期的输出 JSON。

标签: jquery json ajax


【解决方案1】:

逻辑

  • 循环响应键
  • 检查密钥是否为有效日期
  • 如果是,则将该键的日期和温度推送到数组中。

const dates = [];
const temperatures = [];
const response = {
  "request_state": 200,
  "request_key": "fd543c77e33d6c8a5e218e948a19e487",
  "message": "OK",
  "model_run": "14",
  "source": "internal:GFS:1",
  "2021-08-29 17:00:00": {
    "temperature": {
      "2m": 299.8,
      "sol": 299.3,
      "500hPa": -0.1,
      "850hPa": -0.1
    },
    "pression": {
      "niveau_de_la_mer": 101360
    },
    "pluie": 0,
    "pluie_convective": 0,
    "humidite": {
      "2m": 24
    },
    "vent_moyen": {
      "10m": 11.3
    },
    "vent_rafales": {
      "10m": 12
    },
    "vent_direction": {
      "10m": 335
    },
    "iso_zero": 4036,
    "risque_neige": "non",
    "cape": 0,
    "nebulosite": {
      "haute": 0,
      "moyenne": 0,
      "basse": 0,
      "totale": 0
    }
  },
  "2021-08-29 20:00:00": {
    "temperature": {
      "2m": 297.3,
      "sol": 298.5,
      "500hPa": -0.1,
      "850hPa": -0.1
    },
    "pression": {
      "niveau_de_la_mer": 101310
    },
    "pluie": 0,
    "pluie_convective": -0.1,
    "humidite": {
      "2m": 31.1
    },
    "vent_moyen": {
      "10m": 9.8
    },
    "vent_rafales": {
      "10m": 15.6
    },
    "vent_direction": {
      "10m": 311
    },
    "iso_zero": 4061,
    "risque_neige": "non",
    "cape": 0,
    "nebulosite": {
      "haute": 0,
      "moyenne": 0,
      "basse": 0,
      "totale": 0
    }
  }
}

Object.keys(response).forEach((key) => {
  if ((new Date(key)).getTime()) { // Check if the key is a date
    dates.push(key);
    temperatures.push(response[key].temperature.sol)
  }
});

console.log(dates);
console.log(temperatures);

【讨论】:

    猜你喜欢
    • 2014-02-26
    • 1970-01-01
    • 1970-01-01
    • 2019-05-25
    • 1970-01-01
    • 2020-08-09
    • 1970-01-01
    • 1970-01-01
    • 2019-02-19
    相关资源
    最近更新 更多