Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/474.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 未显示表格_Javascript_Html Table - Fatal编程技术网

Javascript 未显示表格

Javascript 未显示表格,javascript,html-table,Javascript,Html Table,我想以我在下面代码中的方式显示表,但不显示在屏幕上,代码只使用html和Javascript <body id="page"> <center> <table id="tables" border="1px" cellspacing="50px" style="margin-top:70px" > <script type="text/javascript"> var row=2; for(var j=

我想以我在下面代码中的方式显示表,但不显示在屏幕上,代码只使用html和Javascript

<body id="page">
 <center>
    <table id="tables" border="1px" cellspacing="50px" style="margin-top:70px" >
    <script type="text/javascript">
     var row=2;

        for(var j=1;j<=2;j++){          
            $('#tables').append("<tr id='row"+j+"' style='margin-bottom:50px'>");
            for(var k=1;k<=5;k++){
                $("#row"+j).append("<td id='table"+k+"' class='button'  width='150' height='150' onclick='printBill("+k+")' background='images/green.png' align='center'>"+
                                            "<font size='+8'><b>"+k+"</b></font>"+
                                            "<br><font id='clock"+k+"' size='+1'> 0:0:0 </font>"+
                                        "</td>");
                }
            $('#tables').append("<tr id='row"+j+"' style='margin-bottom:50px'>");
        }

    </script>

    </table>
</center>
</body>

var行=2;

对于(var j=1;j),您可以使用两种典型的方式围绕页面加载修改文档:

当html仍在加载时:

<table id="tables">
  <tbody>
    <script type="text/javascript">
      document.write('<tr>......</tr>');
    </script>
  </tbody>
</table>

文件。写(“……”);
加载html页面后(更具体地说,当DOM就绪时):


$(函数(){//请参见http://api.jquery.com/jQuery/#jQuery3
//完整的DOM现在已经准备好了,您可以开始修改它了。
$('#tables>tbody')。追加('..');
});
如您所见,我在
表及其
tr
s之间插入了
tbody
标记:浏览器通常创建此
tbody
标记,即使您的源代码不包含它。通过始终添加
tbody
(或者
thead/tfoot
,如果您愿意的话),您可以避免一些潜在的麻烦

请参见示例或搜索
隐式tbody


我稍微整理了一下您的代码:

您的脚本在表对象中可能没有帮助(因此可能找不到)…试着加入一个onload-fired函数我发现你的代码在这里工作得很好:你包括jQuery了吗?offtopic:而不是,你可以在表上使用
左边距:auto;右边距:auto;
。另外,如果你不想过早疯狂,你应该只创建一个id相同的元素:)
<table id="tables">
  <tbody>
  </tbody>
</table>
<script type="text/javascript">
  $(function(){ // see http://api.jquery.com/jQuery/#jQuery3
    // the full DOM is ready now, you can start modifying it.
    $('#tables > tbody').append('<tr>......</tr>');
  });
</script>