Javascript html表未显示

Javascript html表未显示,javascript,html,Javascript,Html,我一直在尝试使用javascript在一个表中合计一个骰子卷列表(对的总和),以避免在html页面中硬编码11行,并在稍后的js文件中分别访问每一行以添加值。 因此,我使用了一个循环和document.writeln()以一种更紧凑的方式来实现这一点,但输出不显示表或任何内容 document.writeln("<table border=\"1\"><thead><tr><th>Sum of Dice</th><th>To

我一直在尝试使用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>");
document.writeln(“总滚动次数之和”);
对于(变量i=0;i<11;i++)
{
书面文件(“2”);
}
文件。书面形式(“”);
行不应该都以2开头,我只使用该数字作为测试,for循环中的第二个标记用于数组中已有的总计,但我的问题是显示表格。

尝试以下方法:

<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>

var代码=”;
函数写入(){
代码+=“掷骰子总次数之和”;
对于(变量i=0;i<11;i++){
代码+=“2”;
}
代码+=”;
document.body.innerHTML=代码;
}
别忘了把这段代码转换成html:

<body onload="write()">

结果如下:


我认为使用一大堆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);
var headerContent=[‘骰子总数’、‘总掷骰次数’];
var table=document.createElement('table'),
header=table.createTHead(),
一行
细胞;
表3.1=1;
//构造头
行=标题。插入行(0);
对于(变量i=0,len=headerContent.length;i

请参见

请检查您的控制台是否有错误。另外,
document.write()
不是您可以用于此类任务的函数。您的代码似乎可以正常工作。你在哪里测试它。Oldskool,你考虑过使用模板引擎吗?可能是时间问题。你怎么称呼它呢?我在HTML文档的开头这样称呼它:你确定吗?此代码段确保删除文档以前的所有内容。请检查。查看图片请在运行此;)后查看页面的真实源代码。我知道,这段代码覆盖了所有以前的内容,但我不知道塔瑞克·梅拉切利想做什么,所以我只是帮助了他。如果他想保留所有以前的代码,那么他需要使用innerHTML,但是如果他只想制作一个表,这个代码就是他想要的。它显示了表,但正如Teemu所提到的,它删除了我的段落和heading哇这太荒谬了,它可以在JSFIDLE上工作,但不能在我的文件中:/I正在将js加载到我的html文件的head元素中,我应该用另一种方式来执行吗?在加载dom元素时执行此代码(当onload事件触发或$.ready()时,如果使用jQuery),否则将其放在包装器元素之后。