显示JSON中包含的URL的图像

时间:2010-11-08 18:43:22

标签: jquery json url

我遇到了一个项目的挑战 - 我试图从JSON提要中指定的URL显示图像。尝试了我能想到的一切,但没有形象。看来我可以获取网址,但不会显示网址。

这是代码 -

<head>
    <script type="application/javascript" src="jquery-1.4.3.min.js"></script>
    <script type="text/javascript">
    $(function() {
        $.getJSON('http://openapi.etsy.com/v2/public/shops/textilesandtreasures?api_key=nshydhv462pr42t7g36b5nky',
        function(data) {
            $('#ShopBanner').html(data.results[0].image_url_760x100); 
        });
    })
    </script>
    </head>
    <body>
        Static Load
        <img src="http://ny-image0.etsy.com/iusb_760x100.7872244.jpg" width="100%"  />
        <br>
        Load from API
        <script language="javascript">
          document.write('<img src="'+ ShopBanner);
          document.write('" width="100%" />');
        </script>
        <ul>
        This is the correct URL being displayed</br>
         <li><a href="" id="ShopBanner"></a></li>
        </ul>
    </div>
    </body>
    </html>

非常感谢帮助解决这个问题。谢谢!

2 个答案:

答案 0 :(得分:2)

将此添加到您的<body>

<div id="ShopBanner"></div>

答案 1 :(得分:0)

您想要创建<img>代码并设置其src属性:

$.getJSON('http://openapi.etsy.com/v2/public/shops/textilesandtreasures?api_key=nshydhv462pr42t7g36b5nky',
function(data)
{
  var $img = $("<img />").attr('src', data.results[0].image_url_760x100);
  $('#ShopBanner').empty().append($img);

});