如何過濾JSON資料以按某些單詞顯示欄位？

我正在尋找一種從與某些單詞匹配的 JSON 資料中獲取 URL 的方法。我不熟悉 JSON，但我的 JSON 資料如下所示：

const data = {
  "links": {
    "thumbnail": [{
        "href": "https://media.wwltv.com/assets/WWL/images/d111cadc-2ca1-4cfc-adec-422d9228e6a0/d111cadc-2ca1-4cfc-adec-422d9228e6a0_1920x1080.jpg",
        "rel": [
          "thumbnail",
          "ssl"
        ],
        "type": "image/jpg",
        "content_length": 123865,
        "media": {
          "width": 1920,
          "height": 1080
        }
      },
      {
        "href": "https://media.wwltv.com/assets/WWL/images/b9c0109f-f504-4330-9dbb-5d0461316d00/b9c0109f-f504-4330-9dbb-5d0461316d00_1140x641.jpg",
        "type": "image/jpg",
        "rel": [
          "twitter",
          "thumbnail",
          "ssl",
          "og"
        ],
        "media": {
          "width": 1140,
          "height": 641
        },
        "content_length": 94781
      }
    ]
  }
};

我的 AJAX 函式如下。它所做的是獲取 JSON 資料，然后將它們存盤在欄位中的值中：

$.ajax({
      type:"GET",
      url: "https://iframe.ly/api/iframely?url="   link_raw.value   "&api_key=xxx",
      success: function(data) {
               $(".acf-fields div.acf-field.acf-field-text.acf-field-62a253c405887 div.acf-input div.acf-input-wrap input").val(JSON.parse(JSON.stringify(data.links.thumbnail[0].href)));
       },
       dataType: 'JSON',
});

我想要做的是顯示hrefif rel[0].twitter。就像是：

if (filter == rel[0].twitter) {
    $(".acf-fields div.acf-field.acf-field-text.acf-field-62a253c405887 div.acf-input div.acf-input-wrap input").val(JSON.parse(JSON.stringify(data.links.thumbnail)));
}

uj5u.com熱心網友回復：

twitter您可以通過是否包含在rel陣列中來過濾每個物件：

const data = {"links":{"thumbnail":[{"href":"https://media.wwltv.com/assets/WWL/images/d111cadc-2ca1-4cfc-adec-422d9228e6a0/d111cadc-2ca1-4cfc-adec-422d9228e6a0_1920x1080.jpg","rel":["thumbnail","ssl"],"type":"image/jpg","content_length":123865,"media":{"width":1920,"height":1080}},{"href":"https://media.wwltv.com/assets/WWL/images/b9c0109f-f504-4330-9dbb-5d0461316d00/b9c0109f-f504-4330-9dbb-5d0461316d00_1140x641.jpg","type":"image/jpg","rel":["twitter","thumbnail","ssl","og"],"media":{"width":1140,"height":641},"content_length":94781}],},};

const filterBy = toFilter => {
  return data.links.thumbnail.filter(({ rel }) => rel.includes(toFilter));
};

console.log(filterBy("twitter"));

.as-console-wrapper { max-height: 100% !important; top: auto; }

href如果您只想要與該專案關聯的 URL，您也可以從這些中提取：

const data = {"links":{"thumbnail":[{"href":"https://media.wwltv.com/assets/WWL/images/d111cadc-2ca1-4cfc-adec-422d9228e6a0/d111cadc-2ca1-4cfc-adec-422d9228e6a0_1920x1080.jpg","rel":["thumbnail","ssl"],"type":"image/jpg","content_length":123865,"media":{"width":1920,"height":1080}},{"href":"https://media.wwltv.com/assets/WWL/images/b9c0109f-f504-4330-9dbb-5d0461316d00/b9c0109f-f504-4330-9dbb-5d0461316d00_1140x641.jpg","type":"image/jpg","rel":["twitter","thumbnail","ssl","og"],"media":{"width":1140,"height":641},"content_length":94781}],},};

const filterBy = toFilter => {
  return data.links.thumbnail.filter(({ rel }) => rel.includes(toFilter)).map(({ href }) => href);
};

console.log(filterBy("twitter"));

.as-console-wrapper { max-height: 100% !important; top: auto; }

標籤：javascript jQuery 数组 json 目的

上一篇：如何存盤以前的值而不是將值存盤在反應狀態的物件陣列中

下一篇：如何回傳在python中的類中呼叫的串列