JSON訪問和在Web瀏覽器中顯示

我試圖在Web瀏覽器上顯示JSON信息，以確保我可以訪問它。JSON訪問和在Web瀏覽器中顯示

的JSON格式爲

[ 
    { 
    "ts": "2016-10-10T04:40:06.567000", 
    "sensor_value": 9.7827 
    }, 
    { 
    "ts": "2016-10-10T04:40:16.613000", 
    "sensor_value": 9.80362 
    }, 
    { 
    "ts": "2016-10-10T04:40:26.660000", 
    "sensor_value": 9.80722 
    }, 
    { 
    "ts": "2016-10-10T04:40:36.600000", 
    "sensor_value": 9.77777 
    }, 
    { 
    "ts": "2016-10-10T04:40:46.643000", 
    "sensor_value": 9.79755 
    }, 
    { 
    "ts": "2016-10-10T04:40:56.580000", 
    "sensor_value": 9.91404 
    } 
]

我使用以下HTML來測試和展示對象爲「UL」

<html> 
<head> 
<script type="text/javascript" 
src="http://code.jquery.com/jquery.min.js"></script> 
<script type="text/javascript"> 
    $(function(){ 
     $.getJSON('CLEVERTITLE.json',function(data){ 
      console.log('success'); 
      $.each(data,function(index,data){ 
       console.log("entered each") 
       $('ul').append('<li>'+data.ts+' ' 
           +data.sensor_value+'</li>'); 
      }); 
     }).error(function(){ 
      console.log("ERROR") 
     }); 
    }); 
</script> 
</head> 
<body> 
    <ul></ul> 
</body> 
</html>

我使用節點實時服務器從目錄通過localhost:8080訪問文件。

但是，運行這隻給我一個文本「undefined undefined」的項目符號。我希望顯示2016-10-10T04:40:46.643000 9.7777。如果我可以訪問「ts」和「sensor_value」標籤，它將來可能會有用。如果這是非常基本的，我很抱歉。

###########

編輯︰原來的問題是數據量。我試圖展示超過一百萬個數據點。當我將這個數量減少到一個更合理的數字時，這個工作正常。感謝大家的回答。

來源

2017-04-14 Anthony Mujica

您確定HTML可以訪問您的json文件嗎？ –

您可能錯誤地表達了問題中的數據，否則您根本得不到任何輸出 –

我猜你的數據實際上是類似'{data：[{---}，{---}，{ - - }]}'，這可以解釋單個迭代的結果爲'undefined，undefined'。 –

您的JSON無效。外部結構不應該是一個對象（{}），而是一個數組（[]）。一個對象包含一組鍵/值對，而一個數組包含一個值列表。

更正如下：

[ 
    { 
    "ts": "2016-10-10T04:40:06.567000", 
    "sensor_value": 9.7827 
    }, 
    { 
    "ts": "2016-10-10T04:40:16.613000", 
    "sensor_value": 9.80362 
    }, 
    { 
    "ts": "2016-10-10T04:40:26.660000", 
    "sensor_value": 9.80722 
    }, 
    { 
    "ts": "2016-10-10T04:40:36.600000", 
    "sensor_value": 9.77777 
    }, 
    { 
    "ts": "2016-10-10T04:40:46.643000", 
    "sensor_value": 9.79755 
    }, 
    { 
    "ts": "2016-10-10T04:40:56.580000", 
    "sensor_value": 9.91404 
    } 
]

來源

2017-04-14 02:51:44

對不起，我只是採取了一些實際的文件在外面[]方括號內的值。我在這裏犯了一個錯誤。 –

我更新了原始文本 –

你的JSON文件應該是這樣的：

[ 
    { 
    "ts": "2016-10-10T04:40:06.567000", 
    "sensor_value": 9.7827 
    }, 
    { 
    "ts": "2016-10-10T04:40:16.613000", 
    "sensor_value": 9.80362 
    }, 
    { 
    "ts": "2016-10-10T04:40:26.660000", 
    "sensor_value": 9.80722 
    }, 
    { 
    "ts": "2016-10-10T04:40:36.600000", 
    "sensor_value": 9.77777 
    }, 
    { 
    "ts": "2016-10-10T04:40:46.643000", 
    "sensor_value": 9.79755 
    }, 
    { 
    "ts": "2016-10-10T04:40:56.580000", 
    "sensor_value": 9.91404 
    } 
]

您<html>標籤之前還要添加<!DOCTYPE html>否則會給你的瀏覽器控制檯下面的警告。

HTML1527: DOCTYPE expected. Consider adding a valid HTML5 doctype: "<!DOCTYPE html>".

來源

2017-04-14 03:16:08 Chip

與問題中的內容有何不同？ –

JSON訪問和在Web瀏覽器中顯示

回答

相關問題