0

私は、JavaScriptを使用してテーブル内のダイスロールのリスト(ペアの合計)を合計して、htmlページの11行をハードコーディングし、後でjsファイルの各行に個別にアクセスして値を追加しないようにしています。そこで、ループとdocument.writeln()を使用してこれをよりコンパクトな方法で実行しましたが、出力にはテーブルなどが表示されません。

document.writeln("<table border=\"1\"><thead><tr><th>Sum of Dice</th><th>Total Times   Rolled</th></tr></thead><tbody>");
for (var i=0; i < 11; i++)
{
    document.writeln("<tr><td>2</td><td></td></tr>");
}
document.writeln("</tbody></table>");

行はすべて2で始まるべきではありません。私はその数値をテストとしてのみ使用し、forループの2番目のタグは、配列にすでにある合計用ですが、私の問題はテーブルの表示にあります。

4

2 に答える 2

0

これを試して:

<script>
        var code = "";
        function write(){
            code += "<table border=\"1\"><tr><th>Sum of Dice</th><th> Total Times Rolled</th></tr>";
            for (var i = 0; i < 11; i++){
                code += "<tr><td>2</td><td></td></tr>";
            }
            code += "</table>";
            document.body.innerHTML = code;
        }
    </script>

そして、このコードを html に入れることを忘れないでください:

<body onload="write()">

ここに結果があります:

ここに画像の説明を入力

于 2013-03-21T17:01:09.210 に答える
0

HTMLテキスト文字列全体を使用してwritelnでテーブルを作成することは、一般的には良い考えではないと思います。Javascript を使用してテーブル dom 要素を作成し、それをラッパー要素に追加することをお勧めします。

var headerContent = ['Sum of Dice', 'Total Times Rolled'];
var table = document.createElement('table'),
    header = table.createTHead(),
    row, 
    cell;

table.border = 1;

// construct header
row = header.insertRow(0);
for (var i = 0, len = headerContent.length; i < len; i++) {
    cell = row.insertCell(i);
    cell.innerHTML = headerContent[i];
}

// construct table content
for (var i = 0; i < 11; i++) {
    row = table.insertRow(i + 1);
    for (var j = 0, len = headerContent.length; j < len; j++) {
        cell = row.insertCell(j);
        cell.innerHTML = '2';
    }
}

// add table element to the dom tree
var wrapper = document.getElementById('wrapper');
wrapper.appendChild(table);

http://jsfiddle.net/LgyuE/を参照

于 2013-03-21T17:33:21.900 に答える