如何创建重复的标题。 [英] How can I create repeated headers.
本文介绍了如何创建重复的标题。的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我知道如何为动态表创建标题但我想创建标题（如果我输入为6 * 6那么标题应该是（| Label | control || Label | control || Label | control |）如何显示。我怎么能重复标题。
谢谢。
我是什么尝试过：
I know how to create headers for dynamic table but i want to create headers like(if i give input as 6*6 then the headers should be (|Label| control||Label| control||Label| control|) display like this. How can i repeat the headers.
Thanks.
What I have tried:
function createTable() {
var rowCtr;
var cellCtr;
var rowCnt;
var cellCnt;
var myTableDiv = document.getElementById("myDynamicTable");
var table = document.createElement('TABLE');
table.setAttribute("contenteditable", "true");
table.border = '1';
table.id = "myTable";
var tableBody = document.createElement('TBODY');
table.appendChild(tableBody);
var orderArrayHeader = ["Label", "Control"];
var thead = document.createElement('thead');
table.appendChild(thead);
for (var i = 0; i < orderArrayHeader.length; i++) {
thead.appendChild(document.createElement("th")).
appendChild(document.createTextNode(orderArrayHeader[i]));
}
rowCnt = document.getElementById('txtrows').value;
cellCnt = document.getElementById('txtcols').value;
for (rowCtr = 0; rowCtr < rowCnt; rowCtr++) {
var thead = document.createElement("thead");
thead.innerHTML = "Header";
var tr = document.createElement('TR');
tableBody.appendChild(tr);
for (cellCtr = 0; cellCtr < cellCnt; cellCtr++) {
tr.appendChild(thead);
var td = document.createElement('TD');
td.width = '120';
td.appendChild(document.createTextNode("Row" + rowCtr + " Column" + cellCtr));
tr.appendChild(td);
}
}
myTableDiv.appendChild(table);
}
推荐答案
试试这个
try this
results = {
weak_sent: [
"row 1 data",
"row 2 data"
],
weak_sent_num: [1,2]
}
function generate_table() {
// get the reference for the body
var body = document.getElementsByTagName("body")[0];
// creates a <table> element and a <tbody> element
var tbl = document.createElement("table");
//var header = document.createElement("header");
// var header = '<tr><th>Country</th><th>City</th></tr>';
var header= document.createElement('thead')
var headingRow = document.createElement('tr')
var headingCell1 = document.createElement('td')
var headingText1 = document.createTextNode('country')
headingCell1.appendChild(headingText1)
headingRow.appendChild(headingCell1)
var headingCell2 = document.createElement('td')
var headingText2 = document.createTextNode('City')
headingCell2.appendChild(headingText2)
headingRow.appendChild(headingCell2)
header.appendChild(headingRow)
tbl.appendChild(header)
//var header = "<th>Header</th>";
var tblBody = document.createElement("tbody");
// creating all cells
for (var i = 0; i < results.weak_sent.length; i++) {
// creates a table row
var row = document.createElement("tr");
for (var j = 0; j < 2; j++) {
// Create a <td> element and a text node, make the text
// node the contents of the <td>, and put the <td> at
// the end of the table row
var cell = document.createElement("td");
if (j == 0) {
var cellText = document.createTextNode(results.weak_sent_num[i]);
} else {
var cellText = document.createTextNode(results.weak_sent[i]);
}
cell.appendChild(cellText);
row.appendChild(cell);
}
// add the row to the end of the table body
tblBody.appendChild(row);
}
// This is for the quick solution
// tbl.innerHTML = header
// put the <tbody> in the <table>
tbl.appendChild(tblBody);
// appends <table> into <body>
body.appendChild(tbl);
// sets the border attribute of tbl to 2;
tbl.setAttribute("border", "2");
}
generate_table()
如果有人需要：
In case anyone needed:
function CreateTable() {
var rowCtr;
var cellCtr;
var rowCnt = getValue;
var cellCnt = getValue;
var myTableDiv = document.getElementById('myDynamicTable');
var table = document.createElement('TABLE');
myDynamicTable.setAttribute("contenteditable", "true");
table.border = '1';
table.id = 'myTable';
var tableBody = document.createElement('TBODY');
table.appendChild(tableBody);
var orderArrayHeader = ["Label", "Control"];
var thead = document.createElement('thead');
table.appendChild(thead);
for (var i = 0; i < cellCnt; i++) {
if (i % 2 == 0) {
thead.appendChild(document.createElement("th")).
appendChild(document.createTextNode(orderArrayHeader[0]));
}
else {
thead.appendChild(document.createElement("th")).
appendChild(document.createTextNode(orderArrayHeader[1]));
}
}
for (rowCtr = 0; rowCtr < rowCnt; rowCtr++) {
var tr = document.createElement('TR');
tableBody.appendChild(tr);
for (cellCtr = 0; cellCtr < cellCnt; cellCtr++) {
var td = document.createElement('TD');
td.width = '120';
td.height = '50';
td.appendChild(document.createTextNode(""));
tr.appendChild(td);
}
}
myTableDiv.appendChild(table);
}
这篇关于如何创建重复的标题。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
