node-webkit讀取json文件

一、原理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 &nbsp;name &nbsp; &nbsp; &nbsp;agae &nbsp;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 + " &nbsp;" + student.name + " &nbsp;" + student.age + " &nbsp; &nbsp;" +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

 

相關文章
相關標籤/搜索