將Json值解析為html標簽

Question

我如何將k和v的每個標簽解析為html標簽。

var json = $.parseJSON(data);
var x = 0;
$(json).each(function(i, val) {
    $.each(val, function(k, v) {

        var my_href = "#";
        var img_source = "..img";
        var my_title = "...abcd";
        var slider_index = "wows_" + x;

        x++; //increment link id

        $('#ws_images').html('<li><a href="' + my_href + '"><img src="' + img_source + '" alt="" title="' + my_title + '" id="' + slider_index + '" /></a></li>');

    });
});

json如下：

[  
   {  
      "news_id":"8",
      "title":"ddd",
      "description":"ddd",
      "photo":"News_images\/20020_1116863714996046_8844424307040103167_n.jpg",
      "posted_on":"2015-07-12 12:54:48",
      "news_type":"image_slider",
      "dept_id":"1"
   }
]

k的值返回標簽名稱，但是如何將每個標簽元素解析為html標簽。

<li><a href="' + my_href + '"><img src="' + img_source + '" alt="" title="' + my_title + '" id="' + slider_index + '" /></a></li>

Answer 1

嘗試利用單個$.each() ，用.append()替換html()

 var data = [{ "news_id": "8", "title": "ddd", "description": "ddd", "photo": "News_images\\/20020_1116863714996046_8844424307040103167_n.jpg", "posted_on": "2015-07-12 12:54:48", "news_type": "image_slider", "dept_id": "1" }]; $.each(data, function(k, v) { $("#ws_images") .append("<li><a href=#>" + "<img src=" + v. photo + " alt=''" + " title=" + v.title + " id=wows_" + k + " />" + "</a></li>"); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> </script> <ul id="ws_images"></ul>