Question

我是JSON和jQuery的新手。这里我想要做的是从JSON获取数据并将其显示在html表中。问题是当我将document.write(ht);写入html文件的head部分时，一切正常。但是当我将document.write(ht);写入html的正文中时，它只显示undefined作为输出。我无法弄清楚为什么会这样。

以下是text.json文件：

   {
     "red":"new_small.gif",
     "green":"new_small.gif"
   }

以下是html文件：

     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     <title>Untitled Document</title>
      <script src="jquery-1.7.2.js"></script>
      <script  type="text/javascript">
        var items = [];
        var ht;
        $.getJSON('text.json', function(data) {
        ht='<table>';
        $.each(data, function(key, val) {
        ht+= '<tr><td>' + key + '</td><td><img src="' + val+ '"></td></tr>';
       });
        ht+='</table>';
      }).success(function() { alert("success"); })
        .error(function() { alert("error"); })
        .complete(function() { alert("complete"); });  
    </script>
    </head>
    <body>
    <script> 
    document.write(ht);  
    </script>
    </body>
    </html>

Answer 1

通过ht调用中的回调函数异步设置

$.getJSON，但会立即触发document.write。

Answer 2

ht + ='table＆gt;';使用这个

  $('div/>', {
    html: ht
  }).appendTo('body');

变量无法取得外头

2 个答案: