我对JSON的经验有限,我正在尝试从数据Feed中提取图像网址 -
这就是我对源的看法 -
<HTML>
<head>
<script type="application/javascript" src="jquery-1.4.3.min.js"></script>
<script type="text/javascript">
$(function()
{
$.getJSON('http://pipes.yahoo.com/pipes/pipe.run?_id=b4cac2fb1f1930eb8efce1812b69d5ab_render=json',
function(data)
{
$('#Item_URL').html(data.value.items[0].description +' URL for item photo.');
});
})
</script>
</head>
<body>
<div id="Item_URL"></div>
</body>
</html>
当然,Item_URL显示了Feed的整个数据元素,其中包含大量不需要的文本!
以下是JSON数据的片段
{
"count": 10,
"value": {
"title": "Etsy Feed",
"description": "Pipes Output",
"link": "http://pipes.yahoo.com/pipes/pipe.info?_id=b4cac2fb1f1930eb8efce1812b69d5ab",
"pubDate": "Mon, 08 Nov 2010 20:19:22 -0800",
"generator": "http://pipes.yahoo.com/pipes/",
"callback": "",
"items": [
{
"link": "http://www.etsy.com/listing/60872596/large-green-seasons-greetings-gift-tags",
"y:title": "Large Green Seasons Greetings Gift Tags Set of 6",
"y:id": {
"value": "http://www.etsy.com/listing/60872596/large-green-seasons-greetings-gift-tags",
"permalink": "true"
},
"guid": "http://www.etsy.com/listing/60872596/large-green-seasons-greetings-gift-tags",
"title": "Large Green Seasons Greetings Gift Tags Set of 6",
"pubDate": "Fri, 05 Nov 2010 08:13:21 -0400",
"description": "<img src=\"http://ny-image3.etsy.com/il_155x125.189695523.jpg\"/><br />$18.00<br />Set of 6 large, green gift tags each measuring 2 5/8 x 5 1/4 inches.<br /><br />",
"y:published": {
"hour": "12",
"timezone": "UTC",
"second": "21",
"month": "11",
"minute": "13",
"utime": "1288959201",
"day": "5",
"day_of_week": "5",
"year": "2010"
}
},
所需的URL位于description元素下,并且是
img src =“http://ny-image3.etsy.com/il_155x125.189695523.jpg”
Feed中的此项目。
仅显示图像的最有效方法是什么?
谢谢!
答案 0 :(得分:0)
以某种方式从图像中获取URL(不能说因为我不知道如何格式化json)
var imgurl = data.value.pic.url; //or whatever
然后在html某处有一个容器
<div class="imageContainer">
</div>
然后使用一些jquery将图像附加到容器div
<script>
$('div.imageContainer').append('<img src="' + imgurl + '"/>');
</script>
编辑:
我现在看到了这个问题,data.value.item [0] .description包含一个图片标签以及不需要的信息(正如你刚才提到的那样)。这实际上有点棘手。你想要做的是将描述中的值包装在一个范围内,然后在其上运行一个选择器来提取图像:
<script>
var crappyData = data.value.item[0].description;
var lessCrappy = '<span>' + crappyData + '</span>';
//Now create a jQuery object out of it
var notCrappy = $(lessCrappy);
//Now run a selector on the jQuery object to get all images in description
var jqueryImage = notCrappy.find('img');
//Now we can append it to the div mentioned earlier
$('div.imageContainer').append(jqueryImage);
</script>
唯一棘手的问题是你必须在某些东西中包含描述,否则jquery将无法理解它,因为它不是格式良好的HTML。
希望这有帮助!