私はいくつかのマニュアルアスペクトをプロジェクトに緩和する関数を構築しようとしています。クライアントは私がテーブルに変換したExcelのリストを私に提供しました(Notepad ++とすてきなjQueryスクリプトのおかげで)。jQueryリストを作成するためにテーブルの列と行を反復する
私の目標は、個々のリストにすべての列ヘッダで構成される列ごと、および「X」細胞のを作ることですが、「X」細胞が一致していることをそれらのテキストを持っています各行の最初の<td>
。
私はそれを試して失敗したので、私は誰かが私が目指していたものを見て、私の欠陥を指摘することを望んでいると思っています。
私が取ったルートは、私はその後、私は私の行の反復と列の反復が後方であるが、任意の助けをいただければ幸いと思われる<div><ul><li>Column Header</li><li>text from first Row (X replaced)</li> etc...</ul></div>
を作成するために、反復処理でしょうきちんと指向配列にすべてを取得することでした。
This StackOverflow postは、私が必要とする要点を持っていますが、私が望むほど包括的ではありません。ここ
$('td').each(function() {
var currentHTML = $(this).html().toString();
if (currentHTML === " ") {
$(this).text("").addClass('nonX');
}
});
var columnIteration = $('tr:eq(0)').find('td').length;
console.log(columnIteration);
var corespondingTD = [];
for (i = 1, z = columnIteration; i < z; i++) {
\t $('tr').each(function() {
\t \t var rowIterated = [];
\t \t var columnHeader = $('tr:eq(0)').find($('td').eq(i)).text();
\t \t var xTD = $(this).find($('td').eq(i)).not($('td.nonX'));
\t \t rowIterated.push(columnHeader);
\t \t rowIterated.push(xTD);
\t \t corespondingTD.push(rowIterated);
\t });
}
table {
border: solid 1px #000;
border-collapse: collapse;
}
td {
border: solid 1px #000;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<table>
<tbody>
<tr>
<td></td>
<td>WILLOW ADD-ON
<span style="mso-spacerun:yes"> </span>$6.99</td>
<td>TV ASIA<span style="mso-spacerun:yes"> </span>$9.99</td>
<td>ZEE TV & STAR INDIA PLUS 2-Pack<span style="mso-spacerun:yes">
</span>$14.99</td>
<td>SET ASIA & STAR INDIA PLUS 2-Pack<span style="mso-spacerun:yes">
</span>$14.99</td>
<td>Hindi 4-Pack
<span style="mso-spacerun:yes"> </span>$24.99</td>
<td>Hindi 4-Pack
<span style="mso-spacerun:yes"> </span>$24.99</td>
<td>Hindi 4-Pack
<span style="mso-spacerun:yes"> </span>$24.99</td>
<td>Desi 4-Pack<span style="mso-spacerun:yes"> </span>$29.99</td>
<td>Hindi 8-Pack
<span style="mso-spacerun:yes"> </span>$34.99</td>
<td>Desi Mega Pack: SET, TV Asia, Zee, Star Plus, Life OK, ABP News, Star Gold
<br> $42.99
</td>
<td>Hindi 12-Pack
<span style="mso-spacerun:yes"> </span>$44.99</td>
<td>Tamil 2-Pack
<span style="mso-spacerun:yes"> </span>$14.99</td>
<td>Punjabi 2-Pack
<span style="mso-spacerun:yes"> </span>$14.99</td>
</tr>
<tr>
<td>ABP NEWS</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>AAPKA COLORS</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
<td>x</td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
<td>x</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>EROS NOW: VIDEO ON DEMAND <font class="font5">($9.99/mo. Add-On)</font></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>LIFE OK</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
<td>x</td>
<td> </td>
<td>x</td>
<td>x</td>
<td>x</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>NDTV 24x7</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>NDTV GOOD TIMES
</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>SAB</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
<td>x</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>SONY MIX</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>STAR INDIA PLUS
<span style="mso-spacerun:yes"> </span></td>
<td> </td>
<td> </td>
<td>x</td>
<td>x</td>
<td>x</td>
<td>x</td>
<td>x</td>
<td>x</td>
<td>x</td>
<td>x</td>
<td>x</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>STAR INDIA GOLD
</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
<td>x</td>
<td> </td>
<td> </td>
<td>x</td>
<td>x</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>SET ASIA</td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
<td>x</td>
<td> </td>
<td>x</td>
<td>x</td>
<td>x</td>
<td>x</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>TV ASIA</td>
<td> </td>
<td>x</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
<td>x</td>
<td>x</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>ZEE BOLLYWOOD</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
<td>x</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>ZEE TV</td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
<td>x</td>
<td>x</td>
<td>x</td>
<td>x</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>WILLOW</td>
<td>x</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>VIJAY</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
</tr>
<tr>
<td>SUN TV</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
<td> </td>
</tr>
<tr>
<td>JUS PUNJABI</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
</tr>
<tr>
<td>TV84</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>x</td>
</tr>
<!--EndFragment-->
</tbody>
</table>
これは大変です。それは私が必要としていたことを正確に行うことを可能にした。列見出しがあまりにも口にまするのはあなたが正しいことでした。一様に構築されていないJSONオブジェクトを動的に反復処理する方法は? –