简体   繁体   中英

How to print data from this JSON Javascript?

I have the code from json, and i would like to print them out to html page.

{"offset":0,
"results":[
  {"link_1/_text":"Reflection",
   "text_1":"January 30, 2015",
   "link_3":"http://pmj.astaga.com/article/?p=414",
   "link_1":"http://pmj.astaga.com/article/?cat=67",
   "link_3/_text":"Meditasi: Makna Rasa Sakit",
   "text_list_1":["kebahagiaan","meditasi","Meditasi: Makna Rasa Sakit |Matchmatter.com","on pain kahlil gibran","puisi kahlil gibran"],
   "image_1":"http://pmj.astaga.com/article/wp-content/uploads/2015/01/Inspirational-Quotes-Image-Khalil-Gibran.jpg",
   "title_text":"Meditasi: Makna Rasa Sakit",
   "text_2":"Semua manusia yang hidup di dunia ini ingin merasakan kebahagiaan, dalam bentuk apapun."
  },
  {"link_1/_text":"Love and Sex",
   "text_1":"January 26, 2015",
   "link_3":"http://pmj.astaga.com/article/?p=411",
   "link_1":"http://pmj.astaga.com/article/?cat=64",
   "link_2":"http://pmj.astaga.com/article/?cat=65",
   "link_3/_text":"Take and Give",
   "text_list_1":["memberi dan menerima","men","Take and Give","Women"],
   "image_1":"http://pmj.astaga.com/article/wp-content/uploads/2015/01/article-2289562-187F97F8000005DC-947_634x482.jpg",
   "title_text":"Take and Give",
   "text_2":"Untuk beberapa alasan yang sulit dimengerti, alam telah membagi pria dan wanita dalam sebuah perbedaan sikap dalam memandang sebuah hal.",
   "link_2/_text":"Men"
  },
  {"link_1/_text":"Women",
   "text_1":"January 23, 2015",
   "link_3":"http://pmj.astaga.com/article/?p=404",
   "link_1":"http://pmj.astaga.com/article/?cat=71",
   "link_3/_text":"10 Saran Bagi Wanita Untuk Menyatakan Cinta Lebih Dulu",
   "text_list_1":["10 saran jika ingin menyatakan cinta","menyatakan cinta",
   "menyatakan cinta kepada pria","menyatakan cinta lebih dulu",
   "Mungkinkah Seorang Wanita Menyatakan Cintanya Lebih Dulu?|Matchmatter.com","wanita"],
   "image_1":"http://pmj.astaga.com/article/wp-content/uploads/2015/01/secret-admirer.jpg",
   "title_text":"10 Saran Bagi Wanita Untuk Menyatakan Cinta Lebih Dulu",
   "text_2":"Apakah anda pernah menyukai seorang pria, dan dilihat dari gelagatnya sepertinya dia juga menyukai anda?"
  }
 ],
  "cookies":[],
  "connectorVersionGuid":"ed0ce142-861e-4d2e-bacd-3dd1de491a69",
  "connectorGuid":"d6d21746-2d8f-4980-b1ec-8e1a5d52b133",
  "pageUrl":"http://pmj.astaga.com/article/?page_id=709"
 }

But the problem is, i got more than one string to call the data, for example

"link_1/_text":"Reflection"

If i use this code i will got Just the URL and not title or content

<script>
  var data = '$json_data';
  $(data.results).each(function() { 
    var output = "<p>" + this.link_1 + "</p>";
    $('#placeholder').append(output);
  });
</script>

The point is, how to print results of Reflection Can you help me for this code?

Thankyou

Using your syntax, you can use both jquery or javascript to iterate on the JSON.

var data = {---YOUR JSON...};

using JQuery

$(data.results).each(function () {
    var output = "<div class='container'>";
    output += "<p>" + this.title_text + "</p>";
    output += "<p>" + this.text_1 + "</p>";
    output += "<p>" + this.link_1 + "</p>";
    output += "</div>";
    $('#placeholder1').append(output);
});

using Javasscript

var d=document.getElementById("placeholder2");
var output="";
for (var i in data.results) {
    output += "<div class='container'>";
    for (var prop in data.results[i]) {
        output += "<p>" + prop + " : " + data.results[i][prop] + "</p>";
    }
    output += "</div>";
}
d.innerHTML=output;

Here the JSFiddle example

You can use Jquery.parseJSON(). This will give you a js object which you can use to achieve what you want.

var obj = jQuery.parseJSON( '{ "name": "John" }' );
alert( obj.name === "John" );

You need to do something like this:

var json = [ 
    { "one": "1" },
    { "two": "2" },
    { "three": "3" }
];

$.each(json, function() {
  $.each(this, function(name, value) {
    /// do stuff
    console.log(name + '=' + value);
  });
});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM