Javascript 从url获取元素属性和JSON

我如何才能做到这一点：

如何使用atribute:data instagram搜索所有跨元素，并使用它提取instagram图像缩略图和url，并将找到的所有图像发送到某个分区

大概是这样的：

$.getJSON({
方法：“GET”，
网址：'https://api.instagram.com/oembed/?url=https://www.instagram.com/p/BNijakrAX5y/?taken-by=nba'，
数据类型：“jsonp”，
成功：功能（响应）{
$（'.nekiDiv'）。追加（''）；
}
});

---

您也可以在这里看到：

首先，您不能使用直接url，您需要使用url

然后您可以将js代码用作：

$("[data-instagram]").each(function(el) {
  $.getJSON({
    method: 'GET',
    url: $(this).data("instagram"),
    dataType: 'jsonp',
    success: function(response) {
      $('.nekiDiv').append('<img src="' + response.thumbnail_url + '">');
    }
  });
})

$（“[data instagram]”）。每个（函数（el）{
$.getJSON({
方法：“GET”，
url:$（此）.data（“instagram”），
数据类型：“jsonp”，
成功：功能（响应）{
$（'.nekiDiv'）。追加（''）；
}
});
})

范例

您需要在HTML中使用

nekiDiv

创建一个div

请参见第一个示例url，如

”https://api.instagram.com/oembed/?url=https://www.instagram.com/p/BNijakrAX5y/?taken-by=nba“

（我明白了为什么现在不能使用

img

：你还没有到实际缩略图的链接；你必须先通过Instagram API才能获得它们。）

您可以使用jQuery选择具有

数据instagram

属性的每个

span

：

$('span[data-instagram]')

然后，对于找到的每个元素，可以模拟链接到Instagram API查询的FIDLE中的功能。当请求成功时，您可以使用回调函数将相应的缩略图插入每个

span

看看。

（StackOverflow代码段似乎在启动跨源请求时遇到问题。）

$（'span[data instagram]'）。每个（函数（i，span）{
$.getJSON({
方法：“GET”，
网址：'https://api.instagram.com/oembed/?url='+span.getAttribute（'data-instagram'），
数据类型：“jsonp”，
成功：功能（响应）{
var img=document.createElement（'img'）；
img.src=response.thumbnail\u url；
span.附加子对象（img）
}
})
})

如果您知道url，并且可以将其保存在html中，为什么不使用img标记并在

src

中给出url？我想这样做，但如果可以，也可以，但问题是我不擅长js，不知道如何管理它。请您的问题在问题正文中直接显示相关代码（而不是依赖外部站点的ilnk）。无论如何，为了让您开始使用，

$（“span[data instagram]”）。每个（function（）{var url=$（this.attr（“data instagram”）；/*…*/}）；

这很好，只是我需要多做一点调整。在html中，我没有

（我在问题中提到的span元素很少），因此，当请求成功时，我想创建该

，并将所有相应的缩略图插入

中，而不是插入每个跨距中，请求成功时将创建

中。最后，它应该是这样的：

..

非常感谢！