我所拥有的是以HTML编码的表格,该表格具有10行和10列,每个单元格都有自己的ID:
<table id="ch4">
<caption>
Multiplication Table
</caption>
<tbody>
<tr>
<th scope="col">*</th>
<th scope="col">1</th>
<th scope="col">2</th>
<th scope="col">3</th>
<th scope="col">4</th>
<th scope="col">5</th>
<th scope="col">6</th>
<th scope="col">7</th>
<th scope="col">8</th>
<th scope="col">9</th>
<th scope="col">10</th>
</tr>
<tr>
<th scope="row">1</th>
<td id="oneX1"> </td>
<td id="oneX2"> </td>
<td id="oneX3"> </td>
<td id="oneX4"> </td>
<td id="oneX5"> </td>
<td id="oneX6"> </td>
<td id="oneX7"> </td>
<td id="oneX8"> </td>
<td id="oneX9"> </td>
<td id="oneX10"> </td>
</tr>
<tr>
<th scope="row">2</th>
<td id="twoX1"> </td>
<td id="twoX2"> </td>
<td id="twoX3"> </td>
<td id="twoX4"> </td>
<td id="twoX5"> </td>
<td id="twoX6"> </td>
<td id="twoX7"> </td>
<td id="twoX8"> </td>
<td id="twoX9"> </td>
<td id="twoX10"> </td>
</tr>
<tr>
<th scope="row">3</th>
<td id="threeX1"> </td>
<td id="threeX2"> </td>
<td id="threeX3"> </td>
<td id="threeX4"> </td>
<td id="threeX5"> </td>
<td id="threeX6"> </td>
<td id="threeX7"> </td>
<td id="threeX8"> </td>
<td id="threeX9"> </td>
<td id="threeX10"> </td>
</tr>
<tr>
<th scope="row">4</th>
<td id="fourX1"> </td>
<td id="fourX2"> </td>
<td id="fourX3"> </td>
<td id="fourX4"> </td>
<td id="fourX5"> </td>
<td id="fourX6"> </td>
<td id="fourX7"> </td>
<td id="fourX8"> </td>
<td id="fourX9"> </td>
<td id="fourX10"> </td>
</tr>
<tr>
<th scope="row">5</th>
<td id="fiveX1"> </td>
<td id="fiveX2"> </td>
<td id="fiveX3"> </td>
<td id="fiveX4"> </td>
<td id="fiveX5"> </td>
<td id="fiveX6"> </td>
<td id="fiveX7"> </td>
<td id="fiveX8"> </td>
<td id="fiveX9"> </td>
<td id="fiveX10"> </td>
</tr>
<tr>
<th scope="row">6</th>
<td id="sixX1"> </td>
<td id="sixX2"> </td>
<td id="sixX3"> </td>
<td id="sixX4"> </td>
<td id="sixX5"> </td>
<td id="sixX6"> </td>
<td id="sixX7"> </td>
<td id="sixX8"> </td>
<td id="sixX9"> </td>
<td id="sixX10"> </td>
</tr>
<tr>
<th scope="row">7</th>
<td id="sevenX1"> </td>
<td id="sevenX2"> </td>
<td id="sevenX3"> </td>
<td id="sevenX4"> </td>
<td id="sevenX5"> </td>
<td id="sevenX6"> </td>
<td id="sevenX7"> </td>
<td id="sevenX8"> </td>
<td id="sevenX9"> </td>
<td id="sevenX10"> </td>
</tr>
<tr>
<th scope="row">8</th>
<td id="eightX1"> </td>
<td id="eightX2"> </td>
<td id="eightX3"> </td>
<td id="eightX4"> </td>
<td id="eightX5"> </td>
<td id="eightX6"> </td>
<td id="eightX7"> </td>
<td id="eightX8"> </td>
<td id="eightX9"> </td>
<td id="eightX10"> </td>
</tr>
<tr>
<th scope="row">9</th>
<td id="nineX1"> </td>
<td id="nineX2"> </td>
<td id="nineX3"> </td>
<td id="nineX4"> </td>
<td id="nineX5"> </td>
<td id="nineX6"> </td>
<td id="nineX7"> </td>
<td id="nineX8"> </td>
<td id="nineX9"> </td>
<td id="nineX10"> </td>
</tr>
<tr>
<th scope="row">10</th>
<td id="tenX1"> </td>
<td id="tenX2"> </td>
<td id="tenX3"> </td>
<td id="tenX4"> </td>
<td id="tenX5"> </td>
<td id="tenX6"> </td>
<td id="tenX7"> </td>
<td id="tenX8"> </td>
<td id="tenX9"> </td>
<td id="tenX10"> </td>
</tr>
</table>
我还为循环嵌套了非常基本的乘法:
for(var i=1; i <=10 ; i++){
for(var j=1; j<=10; j++){
document.writeln(i * j);
}
}
我知道这对我的应用程序是不正确的,但是您必须从某个地方开始。
本质上,我需要做的是将该循环的输出放入相应的表单元格中,以得到如下所示的结果:
x 1 2 3 4 5 6 7 8 9 10
1 1 2 3 4 5 6 7 8 9 10
2 2 4 6 8 10 12 14 16 18 20
3 3 6 9 12 15 18 21 24 27 30
4 4 8 12 16 20 24 28 32 36 40
5 5 10 15 20 25 30 35 40 45 50
6 6 12 18 24 30 36 42 48 54 60
7 7 14 21 28 35 42 49 56 63 70
8 8 16 34 32 40 48 56 64 72 80
9 9 18 27 36 45 54 63 72 81 90
10 10 20 30 40 50 60 70 80 90 100
我遇到的问题之一是,要获取脚本中所有表格单元ID,必须组合两个数组以匹配ID。
var rowID = ['zeroX', 'oneX', 'twoX', 'threeX', 'fourX', 'fiveX', 'sixX', 'sevenX', 'eightX', 'nineX', 'tenX'];
var colID = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '10'];
var combID = " ";
我对如何做感到困惑。我是新Javascript,直到现在才真正接触过它。我应该循环数组吗?我不知道。
使用给定的HTML表,您可以对给定的数组进行迭代以获取ID并为分配一个值innerHTML
。
var rowID = ['zeroX', 'oneX', 'twoX', 'threeX', 'fourX', 'fiveX', 'sixX', 'sevenX', 'eightX', 'nineX', 'tenX'],
colID = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '10'],
table = document.createElement('table'),
tr, td,
i, j;
for (i = 1; i <= rowID.length; i++) {
for (j = 1; j < colID.length; j++) {
document.getElementById(rowID[i] + colID[j]).innerHTML = i * j;
}
}
您可以通过迭代给定的数组来创建带有所需部件的表。
var rowID = ['zeroX', 'oneX', 'twoX', 'threeX', 'fourX', 'fiveX', 'sixX', 'sevenX', 'eightX', 'nineX', 'tenX'],
colID = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '10'],
table = document.createElement('table'),
tr, td,
i, j;
for (i = 0; i <= rowID.length; i++) {
tr = document.createElement('tr');
for (j = 0; j < colID.length; j++) {
td = document.createElement(i && j ? 'td' : 'th');
td.id = rowID[i] + colID[j];
if (i === 0 && j === 0) {
value = 'x';
} else if (i && j) {
value = i * j
} else {
value = i + j;
}
td.appendChild(document.createTextNode(value));
tr.appendChild(td);
}
table.appendChild(tr);
}
document.body.appendChild(table);
td { text-align: right; }
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句