Script
jQuery(function(){
$('p','#demo').remove();
$('#demo').append('<ul/>');
$.each(jsonData,function(i,items){
$("<li/>",{
text:'名前:'+items.name+' 年齢:'+items.age+' スキル:'+items.skills.join(',')
}).appendTo('ul','#demo');
if ( i == 4 ) return false;
});
});
JSON
var jsonData = [
{
"name": "技評太郎",
"age" : 26,
"skills":["PHP" , "JavaScript"]
},
{
"name": "長谷川広武",
"age":25,
"skills":["HTML" , "CSS"]
},
{
"name": "徳田和規",
"age":26,
"skills":["JavaScript" , "jQuery"]
}
]
HTML
//head内
<script type="text/javascript" src="js/sample02.json"></script>
//body内
<div id="demo">
<h4>リスト</h4>
<p><img src="images/loading.gif" width="32" height="32" alt="" /></p>
</div>
Demo
リスト