我正在尝试在页面加载后动态地为许多项创建表。但是，该表不会显示在页面上。 所以，我把我的代码（+100行）放在https://jsfiddle.net/hbbz040/6qjguebd/7/上。
代码有什么问题？我已经看过关于这个主题的其他讨论主题，但没有人帮助过。
欢迎任何帮助和/或对代码的更改！
以下是可以在页面上加载的每个项目的预期结果。
<section class="col-1-60">
<div class="a">
<h3 class="b"></h3>
<div class="c">
<div class="d">
<div class="c">
<table>
<tbody>
<tr class="dheader">
<th rowspan="2">A</th>
<th rowspan="2">B</th>
<th colspan="4">C</th>
<th colspan="3">D</th>
<th colspan="3">E</th>
</tr>
<tr>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
<th>5</th>
<th>6</th>
<th>7</th>
<th>8</th>
<th>9</th>
<th>10</th>
</tr>
<tr>
<td>1</td>
<td class="d">
<figure class="e">
<a><img src="world1.png"></a>
<figcaption><a></a></figcaption>
</figure>
<figure class="e">
<a><img src="world2.png"></a>
<figcaption><a></a></figcaption>
</figure>
</td>
<td>2</td>
<td class="f">1</td>
<td class="g">1</td>
<td class="f g">3</td>
<td>4</td>
<td>4</td>
<td class="f g">$1.000</td>
<td>100%</td>
<td>100%</td>
<td class="f g">1.000</td>
</tr>
<tr>
<td>1</td>
<td class="d">
<figure class="e">
<a><img src="world3.png"></a>
<figcaption><a></a></figcaption>
</figure>
<figure class="e">
<a><img src="world4.png"></a>
<figcaption><a></a></figcaption>
</figure>
</td>
<td>2</td>
<td class="f">1</td>
<td class="g">1</td>
<td class="f g">3</td>
<td>4</td>
<td>4</td>
<td class="f g">1.000</td>
<td>100%</td>
<td>100%</td>
<td class="f g">1.000</td>
</tr>
<tr>
<td>1</td>
<td class="d">
<figure class="e">
<a><img src="world5.png"></a>
<figcaption><a></a></figcaption>
</figure>
<figure class="e">
<a><img src="world6.png"></a>
<figcaption><a></a></figcaption>
</figure>
</td>
<td>2</td>
<td class="f">1</td>
<td class="g">1</td>
<td class="f g">3</td>
<td>4</td>
<td>4</td>
<td class="f g">$1.000</td>
<td>100%</td>
<td>100%</td>
<td class="f g">1.000</td>
</tr>
<tr>
<td>1</td>
<td class="d">
<figure class="e">
<a><img src="world7.png"></a>
<figcaption><a></a></figcaption>
</figure>
<figure class="e">
<a><img src="world8.png"></a>
<figcaption><a></a></figcaption>
</figure>
</td>
<td>2</td>
<td class="f">1</td>
<td class="g">1</td>
<td class="f g">3</td>
<td>4</td>
<td>4</td>
<td class="f g">1.000</td>
<td>100%</td>
<td>100%</td>
<td class="f g">1.000</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</section>
纯JS
function start() {
var arr0 = ["A", "B", "C", "D", "E"];
var arr1 = ['2', '2', '4', '3', '3'];
var arr2 = ["rowspan", "rowspan", "colspan", "colspan", "colspan"]
var arr3 = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10"];
var part = ["SD-001", "SD-002", "SD-003", "SD-004", "SD-005", "SD-006", "SD-007", "SD-008"];
var label = ["world1.png", "world2.png", "world3.png", "world4.png", "world5.png", "world6.png", "world7.png"];
var sec, idx, cab, tac0, tcs, tac1, th, td, a0, a1, img, mycurrent_row, currenttext, figure, figcaption;
var grid = document.getElementsByClassName('grid')[0];
var total_prod = 200;
for(var s = 0; s < total_prod; s++) {
sec = document.createElement('SECTION');
sec.setAttribute('class', 'col-1-60');
idx = document.createElement('DIV');
idx.setAttribute('class', 'a');
cab = document.createElement('H3');
cab.setAttribute('class', 'b');
tac0 = document.createElement('DIV');
tac0.setAttribute('class', 'c');
tcs = document.createElement('DIV');
tcs.setAttribute('class', 'd');
tac1 = document.createElement('DIV');
tac1.setAttribute('class', 'c');
var mytable = document.createElement("table");
var mytablebody = document.createElement("tbody");
for(var j = 0; j < 6; j++) {
mycurrent_row = document.createElement("tr");
if(j = 0) {
mycurrent_row.setAttribute('class', 'dheader');
for(var a = 0; a < arr0.lenght; a++) {
th = document.createElement('th');
th.setAttribute(arr2[a], arr1[a]);
currenttext = document.createTextNode(arr0[a]);
th.appendChild(currenttext);
mycurrent_row.appendChild(th);
mytablebody.appendChild(mycurrent_row);
}
} else if(j = 1) {
for(var b = 0; b < arr3.lenght; b++) {
th = document.createElement('th');
currenttext = document.createTextNode(arr3[b]);
th.appendChild(currenttext);
mycurrent_row.appendChild(th);
mytablebody.appendChild(mycurrent_row);
}
} else if(j > 1) {
for(var l = 0; l < 12; l++) {
td = document.createElement('td');
if(l = 0) {
td.appendChild(document.createTextNode(j + 1));
}
if(l = 1) {
td.setAttribute("class", "d");
for(var m = 0; m < 2; m++) {
figure = document.createElement('figure');
figure.setAttribute('class', 'e');
a0 = document.createElement('a');
img = document.createElement('img');
img.setAttribute('src', label[j + j + m]);
figcaption = document.createElement('figcaption');
a1 = document.createElement('a');
a1.appendChild(document.createTextNode(part[j + j + m]));
figcaption.appendChild(a1);
img.appendChild(figcaption);
a0.appendChild(img);
figure.appendChild(a0);
td.appendChild(figure);
}
}
if(j = 2) {
td.appendChild(document.createTextNode("2"));
}
if(j = 3) {
td.setAttribute('class', 'f');
td.appendChild(document.createTextNode("1"));
}
if(j = 4) {
td.setAttribute('class', 'g');
td.appendChild(document.createTextNode("1"));
}
if(j = 5) {
td.setAttribute('class', 'f g');
td.appendChild(document.createTextNode("3"));
}
if(j = 6) {
td.appendChild(document.createTextNode("4"));
}
if(j = 7) {
td.appendChild(document.createTextNode("4"));
}
if(j = 8) {
td.setAttribute('class', 'f g');
td.appendChild(document.createTextNode("1.000"));
}
if(j = 9) {
td.appendChild(document.createTextNode("200"));
}
if(j = 10) {
td.appendChild(document.createTextNode("206"));
}
if(j = 11) {
td.setAttribute('class', 'f g');
td.appendChild(document.createTextNode("0.971"));
}
mycurrent_row.appendChild(td);
mytablebody.appendChild(mycurrent_row);
}
mytablebody.appendChild(mycurrent_row);
}
}
mytable.appendChild(mytablebody);
tac1.appendChild(mytable);
tcs.appendChild(tac1);
tac0.appendChild(tcs);
cab.appendChild(tac0);
idx.appendChild(cab);
sec.appendChild(idx);
grid.appendChild(sec);
}
}
答案 0 :(得分：0)
检查此https://jsfiddle.net/6qjguebd/42/
在您的代码中，错误地检查了条件
if(j = 0) {
应该是
if(j == 0) { or if(j === 0) {
另外，需要在头文件中包含脚本