とりあえず、最低限の機能でそれなりに速いテーブル生成メソッドが欲しかったので作成。
jQuery1.7.1で動作確認。
配列突っ込むだけです。一応セル単位で属性付与できます。
append()
とか使ってないのは高速化の為。セルが大量だとappend()
使ってるとかなり遅くなりますので。
使い方やサンプルは下記リンク参照。
Edit fiddle - JSFiddle - Code Playground
Test your JavaScript, CSS, HTML or CoffeeScript online with JSFiddle code editor.
プラグインのソースはこれ。使いたい人はコピペして使って下さい。
jquery.tablecell.js
(function($) {
/**
* @param {Array} data
* @return {Array}
*/
$.fn.tableCell = function(data, header) {
var rows = [], i, dl = data.length;
for (i = 0; i < dl; i++) {
rows.push(_buildRow(data[i]));
}
return this.html(rows.join("\n"));
/**
* @param {Array} row
*/
function _buildRow(row) {
var ret = [], i, attr, value, cell, rl = row.length;
var format = (header === undefined || header === false)
? '<td{$attr}>{$value}</td>'
: '<th{$attr}>{$value}</th>';
for (i = 0; i < rl; i++) {
attr = row[i].attr === undefined ? '' : ' ' + _makeAttribute(row[i].attr);
value = row[i].value === undefined ? row[i] : row[i].value;
ret.push(format.replace('{$attr}', attr).replace('{$value}', value));
}
return '<tr>' + ret.join('') + '</tr>';
}
/**
* @param {Object} attr
*/
function _makeAttribute(attr) {
var name, ret = [];
for (name in attr) {
ret.push(name + '="' + attr[name] + '"');
}
return ret.join(' ');
}
};
})(jQuery);
要望あればちょっとカスタムして差し上げますよ、と。
コメント
[…] なお、テーブルの生成については、下記プラグインを使用させてもらった。 www.rainorshine.asia シンプルなテーブルセル生成jQueryプラグイン作った | Rain or Shinehttp://www.rainorshine.asia/ […]