Javascript 未显示表格
我想以我在下面代码中的方式显示表,但不显示在屏幕上,代码只使用html和JavascriptJavascript 未显示表格,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=
<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>