jquery - 尝试从 API JQuery 设置图像源时出现问题

Question

尝试从 Youtube API 设置图像 SCR 时出现问题

jQuery

  $("#imgscr").attr("src", data.items[0].snippet.thumbnails.default.url);

html代码

    <img src="#" id="duckBhaiimg" alt="Alternate Text" />

• 所以我想要实现的是从 JSON 中获取 URL 并设置为#Imgscr。如果您在 JSON 中看到我们在该对象中有“缩略图”对象，我们有“URL”我希望在#Imgscr 上设置它的值。
• 并且还想从本地化对象中获取数据

json

 "items": [
      {
       "kind": "youtube#channel",
       "etag": "\"XpPGQXPnxQJhLgs6enD_n8JR4Qk/8ENLhz-4x-I1Wub-o7UpmXo-rcY\"",
       "id": "UC-lHJZR3Gqxm24_Vd_AJ5Yw",
       "snippet": {
        "title": "PewDiePie",
        "description": "I make videos.",
        "customUrl": "PewDiePie",
        "publishedAt": "2010-04-29T10:54:00.000Z",
        "thumbnails": {
         "default": {
          "url": "https://yt3.ggpht.com/a-/AAuE7mAPBVgUYqlLw9SvJyKAVWmgkQ2-KrkgSv4_5A=s88-mo-c-c0xffffffff-rj-k-no",
          "width": 88,
          "height": 88
         },
         "medium": {
          "url": "https://yt3.ggpht.com/a-/AAuE7mAPBVgUYqlLw9SvJyKAVWmgkQ2-KrkgSv4_5A=s240-mo-c-c0xffffffff-rj-k-no",
          "width": 240,
          "height": 240
         },
         "high": {
          "url": "https://yt3.ggpht.com/a-/AAuE7mAPBVgUYqlLw9SvJyKAVWmgkQ2-KrkgSv4_5A=s800-mo-c-c0xffffffff-rj-k-no",
          "width": 800,
          "height": 800
         }
        },
        "localized": {
         "title": "PewDiePie",
         "description": "I make videos."
        },
        "country": "US"
       }
      }
     ]
    }

标签： jqueryhtmljsonapi

Answer 1

你有这张<img src="#" id="duckBhaiimg" alt="Alternate Text" />id 的图像，duckBhaiimg并且jQuery你正在寻找 id imgscr。

将您的代码更改为以下内容。

<img src="#" id="imgscr" alt="Alternate Text" />
$("#imgscr").attr("src", data.items[0].snippet.thumbnails.default.url);

const data = { items: [
      {
       "kind": "youtube#channel",
       "etag": "\"XpPGQXPnxQJhLgs6enD_n8JR4Qk/8ENLhz-4x-I1Wub-o7UpmXo-rcY\"",
       "id": "UC-lHJZR3Gqxm24_Vd_AJ5Yw",
       "snippet": {
        "title": "PewDiePie",
        "description": "I make videos.",
        "customUrl": "PewDiePie",
        "publishedAt": "2010-04-29T10:54:00.000Z",
        "thumbnails": {
         "default": {
          "url": "https://yt3.ggpht.com/a-/AAuE7mAPBVgUYqlLw9SvJyKAVWmgkQ2-KrkgSv4_5A=s88-mo-c-c0xffffffff-rj-k-no",
          "width": 88,
          "height": 88
         },
         "medium": {
          "url": "https://yt3.ggpht.com/a-/AAuE7mAPBVgUYqlLw9SvJyKAVWmgkQ2-KrkgSv4_5A=s240-mo-c-c0xffffffff-rj-k-no",
          "width": 240,
          "height": 240
         },
         "high": {
          "url": "https://yt3.ggpht.com/a-/AAuE7mAPBVgUYqlLw9SvJyKAVWmgkQ2-KrkgSv4_5A=s800-mo-c-c0xffffffff-rj-k-no",
          "width": 800,
          "height": 800
         }
        },
        "localized": {
         "title": "PewDiePie",
         "description": "I make videos."
        },
        "country": "US"
       }
      }
     ]
             }
$("#imgscr").attr("src", data.items[0].snippet.thumbnails.default.url);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<img src="#" id="imgscr" alt="Alternate Text" />