不錯喔,自己寫出來總是比較有成就感而且可以比較踏實學到東西。
不過你用的 append 和 jQuery 的 selector 太頻繁,效能比較不是那麼好,如果先把 html 組起來,一次 append 會比較好,而且字串的組合要用來 array 操作,效能會更好。
$(function(){
$.getJSON("test.json", function(json){
var html = [];
//在maintable裡面增加id為title的<tr>
html.push('<tr id=title>');
for (var i=0; i<json.column.length; i++) {
//抓取json裡column欄位的資料寫入td,並依附id為title的tr
html.push('<td>', json.column, '</td>');
}
html.push('</tr>');
//依data資料的數量,跑迴圈
for (var y=0; y<json.data.length; y++) {
var name = "mycol";
var a = json.data[y].a;
var b = json.data[y].b;
var c = json.data[y].c;
//在maintable再增加一列tr,並名為name_y(以識別每列tr名稱)
html.push('<tr id=', name, "_", y, '>');
//抓取json裡data欄位的資料寫入td,並依附id為各name_y的tr
html.push('<td>', a,'</td><td>', b,'</td><td>', c,'</td>');
html.push('</tr>');
}
$('#maintable').append(html.join(''));
});
});
|