JS Object elements printing in a web page

Question

How can I print object array elements values in a web page using document.write ?

 <!DOCTYPE html> <html> <body>

 <script>

   var data =  [
           {
             "metadata" : {
                 "names":["times","values","types"],
                 "types":["time","linear","ordinal"]
             },
             "data": [
             ["1141237500000",4.216,"Global_active_power"],
             ["1141237560000",2.4130,"Global_active_power"],
             ["1141237620000",3.4230,"Global_active_power"],
             ["1141237680000",2.4560,"Global_active_power"],
             ["1141237500000",2.37130,"Voltage"],
             ["1141237560000",2.35840,"Voltage"],
             ["1141237620000",0.32690,"Voltage"],
             ["1141237680000",10.30980,"Voltage"],
             ["1141237500000",13.800,"Global_intensity"],
             ["1141237560000",16.400,"Global_intensity"],
             ["1141237620000",25.400,"Global_intensity"],
             ["1141237680000",13.800,"Global_intensity"],
           ],
           }
         ];

   document.write( data["data"] );

 </script> </body> </html>

Possible duplicate of [How can I display a JavaScript object?](http://stackoverflow.com/questions/957537/how-can-i-display-a-javascript-object) — raphaëλ, Jul 21 '16 at 09:35
@SunnySoni OP asked about printing it to a webpage. In that case, `console.log()` can't be used. — Mohit Bhardwaj, Jul 21 '16 at 09:36
@MohitBhardwaj right, but most possibly he would have been debugging it so console will help more. — Sunny Soni, Jul 21 '16 at 09:40
Please check my updated code. I have ouputted only "data" property of this array. — Mohit Bhardwaj, Jul 21 '16 at 09:48
Yeah , that's worked. I couldn't figure out that was you . sorry for that. — , Jul 21 '16 at 09:51

Mohit Bhardwaj · Answer 1 · 2016-07-21T10:14:26.817

0

You can use JSON.stringify() to convert your object in a string form, which can the be printed on your html page with document.write.

var data =  [
           {
             "metadata" : {
                 "names":["times","values","types"],
                 "types":["time","linear","ordinal"]
             },
             "data": [
             ["1141237500000",4.216,"Global_active_power"],
             ["1141237560000",2.4130,"Global_active_power"],
             ["1141237620000",3.4230,"Global_active_power"],
             ["1141237680000",2.4560,"Global_active_power"],
             ["1141237500000",2.37130,"Voltage"],
             ["1141237560000",2.35840,"Voltage"],
             ["1141237620000",0.32690,"Voltage"],
             ["1141237680000",10.30980,"Voltage"],
             ["1141237500000",13.800,"Global_intensity"],
             ["1141237560000",16.400,"Global_intensity"],
             ["1141237620000",25.400,"Global_intensity"],
             ["1141237680000",13.800,"Global_intensity"],
           ],
           }
         ];
             
var innerDataValues = data[0].data;

// document.write( JSON.stringify(data ) );
for( var i = 0; i < innerDataValues.length; i++ )
{
  var value = innerDataValues[i];
  document.write( value[0] + "<br />"); // 0 for timestamp
}

edited Jul 21 '16 at 10:14

answered Jul 21 '16 at 09:34

Mohit Bhardwaj

9,650
3
37
64

It could be the answer? I con't understand those question why he don't write any description? – DMS-KH Jul 21 '16 at 09:37
@HengSopheak Yes, because in its current form i.e. `document.write( data );` it will not print contents of the Object but `object Object`. – Mohit Bhardwaj Jul 21 '16 at 09:39
Thanks all for your quick responses , actually what I need to know is how to go through with data object data key("data":) elements – Jul 21 '16 at 09:43
@IT14064432FirnasA.M can you share the expected output please. That will be helpful. – Mohit Bhardwaj Jul 21 '16 at 09:44
go through the data object data key values , that means ["1141237500000",4.216,"Global_active_power"] , [...] etc.. and select only needed some timestamp arrays. (by if condition).I need to to know how to traverse through the data values and select only from it . – Jul 21 '16 at 09:49
@MohitBhardwaj got it ? – Jul 21 '16 at 09:59
need something like this , document.write(JSON.stringify(data[0].data[0].times) ); – Jul 21 '16 at 10:04
Yeap , basically need to traverse through each and every timestamp one by one. – Jul 21 '16 at 10:08
I got it, document.write(JSON.stringify((data[0].data[0])[0])); – Jul 21 '16 at 10:13
Yes, like that. But you need to iterate through the array using `for` or some other loop. I have updated the answer. – Mohit Bhardwaj Jul 21 '16 at 10:15
Yes ,great.Thank you so much. – Jul 21 '16 at 10:37
Hi, how to compare two timestamps in javascript ? `if(((innerDataValues[0])[0]) >= start1.getTime()) ` . The greater than or less than operators not working for timestamp values ( epoch time) . – Jul 22 '16 at 03:50
@IT14064432FirnasA.M You can try with this code: `if((( parseInt(innerDataValues[0])[0]) ) >= start1.getTime())`. I would recommend opening a new question in case you have additional queries. This will help future users and may get more detailed answers specifically for that issue. – Mohit Bhardwaj Jul 22 '16 at 06:05
question limits exceed :( that's the reason. Thanks anyway. – Jul 22 '16 at 06:12
@IT14064432FirnasA.M Ok then :) . Try that code, may be because the timestamps in your data are in string format, you were not able to compare it to epoch timestamp. I'm not very sure though. – Mohit Bhardwaj Jul 22 '16 at 06:13
am I asking easy questions or irrelavant questions here, because of the limit exceeding . Just tell me then I can understand I am wrong . my bad :( – Jul 22 '16 at 06:20
@IT14064432FirnasA.M No, I don't think that is so. You can check the more probable reasons here - http://meta.stackexchange.com/questions/219683/question-limit-exceeded-but-i-havent-asked-any – Mohit Bhardwaj Jul 22 '16 at 06:38

JS Object elements printing in a web page

1 Answers1