解析JSON值到html标记

问题描述：

如何解析k和v的每个标记到html标记。解析JSON值到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>

答

尝试利用单个$.each()，用于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>

代 .append()

解析JSON值到html标记

相关推荐