2016-12-09 15 views
1

我想要訪問JSON數據文件中的數據,通過使用JavaScript文件將其打印到HTML頁面。到目前爲止,它返回'未定義',我不知道爲什麼。繼承人的代碼在我的文件:如何從JavaScript文件中的JSON文件訪問數據,然後將其打印到HTML頁面?

template.html:

<!DOCTYPE html> 
<html> 
    <head> 
    <script type ="text/javascript" src="populate.js"></script> 
    </head> 

    <body> 
    <script> 
     document.write(me); 
    </script> 
    <body> 

這是我的stuff.json文件:

[ 
{"firstname":"James", "lastname":"Davies", "Age":"25"}, 
{"firstname":"Bill", "lastname":"Jones", "Age":"40"} 
] 

,這是populate.js

var me; 
$.getJSON("stuff.json", function(data) { 
    me = data; 
}); 

所有這些文件都在同一個目錄中。我不知道爲什麼我的變量沒有被JavaScript文件繼承,因此打印到HTML頁面。

+2

的問題是,因爲AJAX請求是異步的,所以你寫你的'me'變量的DOM它被設置之前。這就好比在交付之前嘗試吃披薩。請參閱我標記爲重複的問題以獲取有關此問題的更多信息和解決方案。另外,千萬不要使用'document.write()'。 –

+0

另外,因爲你有一個對象的數組,你試圖直接寫入DOM,它將被強制爲一個字符串,所以輸出將是'[object Object],[object Object]'這是我猜測不是你想要的。我建議你研究如何遍歷該數組並讀取包含對象的屬性。 –

+0

嗨,謝謝,我實際上看不到你標記爲重複的問題?我應該用什麼來代替document.write()? – trouselife

回答

0

也許這是一個競爭狀態,嘗試:

window.onload = function() { 
     document.write(me); 
    } 
相關問題