这是我的HTML表格:
<table class="kobel_days_table" id="kobel_days_table" style="display: none;">
<tr>
<th>Wochentag</th>
<th>Datum</th>
<th>Thema</th>
<th>Kobelwirte</th>
</tr>
</table>
使用js,我要添加值:
//Zeile erstellen
var y = document.createElement([doc.id]);
y.setAttribute("id", [doc.id]);
document.getElementById("kobel_days_table").appendChild(y);
//Spalten in einer Zeile
var y = document.createElement("TR");
y.setAttribute("id", [doc.id]);
//Spalten in einer Zeile
var cE = document.createElement("TD");
var tE = document.createTextNode(kobel_days_info[0]);
cE.appendChild(tE);
y.appendChild(cE);
var a = document.createElement("TD");
var b = document.createTextNode(kobel_days_info[1]);
a.appendChild(b);
y.appendChild(a);
var c = document.createElement("TD");
var d = document.createTextNode(kobel_days_info[2]);
c.appendChild(d);
y.appendChild(c);
var e = document.createElement("TD");
var f = document.createTextNode(kobel_days_info[3]);
e.appendChild(f);
y.appendChild(e);
document.getElementById("kobel_days_table").appendChild(y);
最后是CSS:
.kobel_content table {
border-collapse: collapse;
width: 100%;
}
.kobel_content th, td {
padding: 8px;
text-align: left;
border-bottom: 1px solid #ddd;
}
现在是我的问题。这是理解助手的图像:https://www.dropbox.com/s/rjxuih67qpgr7o7/bug.PNG?dl=0
这些值不在这些值的中心。 “蒙塔格”应该在“ Wochentag”下居中,“ 05.03”在“基准”下居中,依此类推...
但是无论如何都行不通。
〜filip
答案 0 :(得分:0)
问题可能是您没有使用<thead>
和<tbody>
标签。参见here。
//Spalten in einer Zeile
var y = document.createElement("TR");
y.setAttribute("id", 'what-id');
//Spalten in einer Zeile
var cE = document.createElement("TD");
var tE = document.createTextNode('test');
cE.appendChild(tE);
y.appendChild(cE);
var a = document.createElement("TD");
var b = document.createTextNode('test');
a.appendChild(b);
y.appendChild(a);
var c = document.createElement("TD");
var d = document.createTextNode('test');
c.appendChild(d);
y.appendChild(c);
var e = document.createElement("TD");
var f = document.createTextNode('test');
e.appendChild(f);
y.appendChild(e);
document.getElementById("kobel_days_table").children[1].appendChild(y);
.kobel_content table {
border-collapse: collapse;
width: 100%;
}
.kobel_content th, td {
padding: 8px;
text-align: left;
border-bottom: 1px solid #ddd;
}
<table clas="kobel_days_table" id="kobel_days_table">
<thead>
<tr>
<th>Wochentag</th>
<th>Datum</th>
<th>Thema</th>
<th>Kobelwirte</th>
</tr>
</thead>
<tbody></tbody>
</table>