ポップアップでjsonとshow imageを解析する

私はjavascriptでchromeのxkcd拡張子を書こうとしています。最新の画像へのURLを取得するには、http://dynamic.xkcd.com/api-0/jsonp/comic/からJSONを取得して解析してみます。明らかに、それはうまくいきません。ポップアップでjsonとshow imageを解析する

jsonが正しく解析されていないか、ポップアップにハードコードされたURLの画像も表示されません。どうすればこれらの問題を解決できますか？

だから私の質問は以下のとおりです。私は、JSONからの画像のURLを取得するにはどうすればよい

？
画像をポップアップに挿入するにはどうすればよいですか？ここで

は私のコードです：（私はチュートリアルの後、左いくつかのちらつきのスニペットは...まだだ理由です）

manifest.jsonを：

{ 
"name": "xkcd extension", 
"version": "1.0", 
"description": "The first xkcd extension that I made.", 
"browser_action": { 
    "default_icon": "icon.png", 
    "popup": "popup.html" 
}, 
"permissions": [ 
"http://www.xkcd.com/" 
] 
}

ポップアップ.htmlを：

<!doctype html> 
<html> 
<head> 
    <title>Getting Started Extension's Popup</title> 
    <style> 
     body { 
      min-width:357px; 
      overflow-x:hidden; 
     } 

     img { 
      margin:5px; 
      border:2px solid black; 
      vertical-align:middle; 
      width:300px; 
      height:300px; 
     } 
    </style> 

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"> 
    </script> 
    <script> 
     showPhotos(); 

     function showPhotos() { 
      //    var url="http://xkcd.com/info.0.json"; 
      var url = "http://dynamic.xkcd.com/api-0/jsonp/comic/"; 
      alert(url); 
      //    var imgURL; 
      //    $.getJSON(url, function(data) { 
      //     alert(data.img); 
      //     imgURL=data.img; 
      //    }); 
      //alert(imgURL); 

      var img = document.createElement("image"); 
      alert(img); 
      img.src = 'http://imgs.xkcd.com/comics/wrong_superhero.png'; 
      alert(img.src); 
      document.body.appendChild(img); 
     } 

    </script> 
</head> 
<body> 
    <div id="result"> 
    </div> 
</body> 
</html>

出典

2012-02-05 bogus

var img = document.createElement("image");

は間違い

var img = document.createElement("img");

出典

2012-02-05 16:30:30

おかげで、私はこれを変更する必要があります。しかし、なぜ漫画は表示されていませんか？ – bogus

私は[このスレッド]（http://stackoverflow.com/questions/9140632/parse-json-from-url）を知っていますが、未知の理由でgetJSONは私に欲しい属性を与えません – bogus

OK、他の点は、あなたのDOM（特に 'document.body'）の準備が整う前に' showPhotos（） '**を呼び出そうとしていることです。 'showPhotos（）'を直接呼び出すのではなく、 'onload'ハンドラで呼び出します：' ' - これは私のために働きました。 –

ポップアップでjsonとshow imageを解析する

答えて

関連する問題