一、原理javascript
node-webkit包含了node.js,node.js提供了處理json數據文件的方法,經過node.js提供的方法,咱們能夠比較方便地讀取json文件。html
二、示例java
這裏咱們讀取的文件是包外的json文件,也就是說,該文件無需與運行的那三個文件一塊兒打包。node
a、新建index.html文件,咱們將讀取的json數據在index.html文件中顯示出來web
1 <html> 2 <head> 3 <title>read json file</title> 4 <meta http-equiv="Content-Type" content="text/html; charset=gbk" /> 5 <script type="text/javascript" src="script.js"></script> 6 </head> 7 <body > 8 9 <div id="info"><div> 10 </body> 11 </html>
b、新建package.json文件文件內容以下json
1 { 2 "name": "nw-demo", 3 "main": "index.html" 4 }
c、新建json.json文件,這是咱們要讀取的文件,咱們將它放於C:\Users\user\dome\testjson這個路徑下。文件內容以下數組
1 { 2 "tclass":"計算機", 3 "students":[{ 4 "id":1, 5 "name":"zhangsan", 6 "age":20, 7 "gender":"meal" 8 },{ 9 "id":1, 10 "name":"zhangsan", 11 "age":20, 12 "gender":"meal" 13 }] 14 }
d、新建script.js文件,文件內容以下dom
1 var fs = require('fs'); //加載node.js處理json的相關模塊 2 3 fs.readFile('C:/Users/user/dome/testjson/json.json',function(err,data){//指定json.json文件路徑 4 if(err) throw err; 5 var jsonObj = JSON.parse(data); //轉換成json對象 6 var clas = jsonObj.class; //計劃模式數組 7 var info="id name agae gender</br>"; 8 var students = jsonObj.students; 9 for(var i = 0; i < students.length; i++){ 10 var student = students[i]; 11 info += student.id + " " + student.name + " " + student.age + " " +student.gender + "</br>"; 12 } 13 var infodiv = document.getElementById("info"); 14 infodiv.innerHTML=info; 15 }) 16
將index.html、package.json、script.js三個文件壓縮成zip包(三個文件在根目錄下),重命名爲testjson.nw.運行。注意的是json.json文件的路徑不能錯。運行結果以下:ui