[英]how to make JavaScript cell take full row width
I have a table which takes data from an array.我有一个从数组中获取数据的表。 My problem is that I do not know how to make it so that the cell takes the whole row if the objects in the array have a value of zero.
我的问题是,如果数组中的对象的值为零,我不知道如何使单元格占据整行。 If it has a value greater than zero, 2 cells will be displayed one with an item name and another with its value.
如果它的值大于零,将显示 2 个单元格,一个带有项目名称,另一个带有其值。 Any help is much appreciated.
任何帮助深表感谢。
//breaks loop if x is == to counters array
if (this.state.counters.length == x) {
break;
}
const info = this.state.counters[x]["text"];
const quantity = this.state.counters[x]["value"];
console.log(info, quantity);
//creates rows based on input
var table = document.getElementById("myList");
var row = table.insertRow(1);
document.getElementById("thTitle").style.maxWidth = "100px";
if (quantity <= 0) {
var itemCell = row.insertCell(0);
itemCell.innerHTML = info;
} else {
var itemCell = row.insertCell(0);
var quantityCell = row.insertCell(1);
itemCell.innerHTML = info;
itemCell.style.minWidth = "100px";
quantityCell.innerHTML = quantity;
}
This is my output:这是我的 output:
there is the attribute colspan to td tag that the number is the number of rows he stretched on.有属性 colspan 到 td 标签,数字是他拉伸的行数。
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
<tr>
<td colspan="2">Sum: $180</td>
</tr>
</table>
//In Js just add
itemCell.setAttribute('colspan', '2');
when the quantity <= 0
put this in:把这个放在:
if (quantity <= 0) {
var itemCell = row.insertCell(0);
itemCell.innerHTML = info;
// this line
itemCell.setAttribute('colspan', '2');
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.