Создание Javascript & lt; td & gt; элементов в Loop [duplicate]

Если у вас есть код в вашем Page_Load () событии. Попробуйте добавить это:

if (!Page.IsPostBack)
{ 
//your code here 
}
68
задан Manny Fitzgerald 1 February 2013 в 11:54
поделиться

4 ответа

Слегка более короткий код с использованием insertRow и insertCell :

function tableCreate(){
    var body = document.body,
        tbl  = document.createElement('table');
    tbl.style.width  = '100px';
    tbl.style.border = '1px solid black';

    for(var i = 0; i < 3; i++){
        var tr = tbl.insertRow();
        for(var j = 0; j < 2; j++){
            if(i == 2 && j == 1){
                break;
            } else {
                var td = tr.insertCell();
                td.appendChild(document.createTextNode('Cell'));
                td.style.border = '1px solid black';
                if(i == 1 && j == 1){
                    td.setAttribute('rowSpan', '2');
                }
            }
        }
    }
    body.appendChild(tbl);
}
tableCreate();

Кроме того, это не использует некоторые «плохие практики», такие как установка атрибута border вместо использования CSS, и он обращается к body через document.body вместо document.getElementsByTagName('body')[0];

86
ответ дан Cerbrus 26 August 2018 в 22:40
поделиться
<!DOCTYPE html>
<html>
    <body>
        <p id="p1">
            <b>Enter the no of row and column to create table:</b>
            <br/><br/>
            <table>
                <tr>
                    <th>No. of Row(s) </th>
                    <th>No. of Column(s)</th>
                </tr>
                <tr>
                    <td><input type="text" id="row" value="4" /> X</td>
                    <td><input type="text" id="col" value="7" />Y</td>
                </tr>
            </table>
            <br/>
            <button id="create" onclick="create()">create table</button>
        </p>
        <br/><br/>
        <input type="button" value="Reload page" onclick="reloadPage()">
        <script>
            function create() {
                var row = parseInt(document.getElementById("row").value);
                var col = parseInt(document.getElementById("col").value);

                var tablestart="<table id=myTable border=1>";
                var tableend = "</table>";
                var trstart = "<tr bgcolor=#ff9966>";
                var trend = "</tr>";
                var tdstart = "<td>";
                var tdend = "</td>";
                var data="data in cell";
                var str1=tablestart + trstart + tdstart + data + tdend + trend + tableend;
                document.write(tablestart);

                for (var r=0;r<row;r++) {
                    document.write(trstart);
                    for(var c=0; c<col; c++) {
                        document.write(tdstart+"Row."+r+" Col."+c+tdend);
                    }
                }

                document.write(tableend);
                document.write("<br/>");
                var s="<button id="+"delete"+" onclick="+"deleteTable()"+">Delete top Row </button>";
                document.write(s);
                var relod="<button id="+"relod"+" onclick="+"reloadPage()"+">Reload Page </button>";
                document.write(relod);
            }
            function deleteTable() {
                var dr=0;
                if(confirm("It will be deleted..!!")) {
                    document.getElementById("myTable").deleteRow(dr);
                }
            }
            function reloadPage(){
                location.reload();
            }
        </script>
    </body>
</html>
3
ответ дан Community 26 August 2018 в 22:40
поделиться

Надеюсь, вы найдете это полезным.

HTML:

<html>
<head>
    <link rel = "stylesheet" href = "test.css">
<body>

</body>
<script src = "test.js"></script>
</head>
</html>

JAVASCRIPT:

var tableString = "<table>",
    body = document.getElementsByTagName('body')[0],
    div = document.createElement('div');

for (row = 1; row < 101; row += 1) {

    tableString += "<tr>";

    for (col = 1; col < 11; col += 1) {

        tableString += "<td>" + "row [" + row + "]" + "col [" + col + "]" + "</td>";
    }
    tableString += "</tr>";
}

tableString += "</table>";
div.innerHTML = tableString;
body.appendChild(div);
3
ответ дан Shubham Arya 26 August 2018 в 22:40
поделиться

var btn = document.createElement('button');
btn.innerHTML = "Create Table";
document.body.appendChild(btn);
btn.addEventListener("click", createTable, true);
function createTable(){
var div = document.createElement('div');
div.setAttribute("id", "tbl");
document.body.appendChild(div)
	document.getElementById("tbl").innerHTML = "<table border = '1'>" +
  '<tr>' +
    '<th>Heading</th>' +
    '<th>Heading</th> ' +
    '<th>Heading</th>' +
  '</tr>' +
  '<tr>' +
    '<td>cell</td>' +
    '<td>cell</td>' +
    '<td>cell</td>' +
  '</tr>' +
  '<tr>' +
    '<td>cell</td>' +
    '<td>cell</td>' +
    '<td>cell</td>' +
  '</tr>' +
  '<tr>' +
    '<td>cell</td>' +
    '<td>cell</td>' +
    '<td>cell</td>' +
  '</tr>'
};

1
ответ дан vicky patel 26 August 2018 в 22:40
поделиться
Другие вопросы по тегам:

Похожие вопросы: