table要素をもとにハッシュを生成
table要素をもとにハッシュを生成するには、次のような方法で可能です。
関数定義
/**
* table要素をもとにハッシュを生成
* @param {Element|Node} targetTable 対象のtable要素
* @param {string[]} keyNames キーとして与えるカラム名
* @return {object|object[]} 変換されたハッシュ(または配列の入れ子)を返す
*/
var hash2table = function(targetTable, keyNames) {
var result = false;
if (!keyNames) keyNames = [];
// tbody取得
var getTbody = function(parentElement) {
var result = false,
childNodes = getChildrenNotTextNode(parentElement);
for (var i = 0, len = childNodes.length; i < len; i++) {
if (childNodes[i].tagName && childNodes[i].tagName.toLowerCase() === 'tbody') {
result = childNodes[i];
break;
}
}
return result;
};
// 行取得(tr)
var getRows = function(parentElement) {
var results = false,
childNodes = getChildrenNotTextNode(parentElement);
for (var i = 0, len = childNodes.length; i < len; i++) {
if (childNodes[i].tagName && childNodes[i].tagName.toLowerCase() === "tr") {
if (!results) results = [];
results.push(childNodes[i]);
}
}
return results;
};
// セル取得(th, td)
var getCells = function(parentElements) {
var results = false,
childNodes = [],
ii = 0,
len2 = 0,
key = 0,
cellCount = 0;
columnKey = false;
childNodes = getChildrenNotTextNode(parentElements[0]);
if (keyNames.length === childNodes.length) columnKey = true;
for (var i = 0, len = parentElements.length; i < len; i++) {
childNodes = getChildrenNotTextNode(parentElements[i]);
if (!results) results = [];
results[i] = columnKey ? {} : [];
cellCount = 0;
for (ii = 0, len2 = childNodes.length; ii < len2; ii++) {
if (childNodes[ii].tagName && childNodes[ii].tagName.toLowerCase().match(/^t[dh]$/)) {
key = columnKey ? keyNames[cellCount] : cellCount;
if (childNodes[ii].innerText) {
results[i][key] = childNodes[ii].innerText;
} else if (childNodes[ii].textContent) {
results[i][key] = childNodes[ii].textContent;
} else {
results[i][key] = '';
}
cellCount++;
}
}
}
return results;
};
// テキストノードを除く子要素を取得
var getChildrenNotTextNode = function(parentElement) {
var results = false,
childNodes = parentElement.childNodes;
for (var i = 0, len = childNodes.length; i < len; i++) {
if (childNodes[i].nodeType !== 3) {
if (!results) results = [];
results.push(childNodes[i]);
}
}
return results;
};
if (targetTable && typeof targetTable === 'object') {
var tbodyElement = getTbody(targetTable),
rowElements = false,
celsData = false;
result = {};
if (tbodyElement) rowElements = getRows(tbodyElement);
if (rowElements && rowElements.length > 0) {
celsData = getCells(rowElements);
}
if (celsData && celsData.length > 0) result = celsData;
}
return result;
};
使い方
構文
var result = hash2table(targetTable[, keyNames]);
引数
引数名 | 型 | 説明 | |
---|---|---|---|
第一引数 必須 |
targetTable | Element|Node | 対象のtable要素 |
第二引数 | keyName | string[] | キーとして与えるカラム名 |
戻り値
変換されたハッシュ(または配列の入れ子)を返します。
var tableElement = document.getElementById('table-area');
var hash = hash2table(tableElement);