Question

发生了一些非常奇怪的事情，它在我document.write()之外的window.onload = function(){}时起作用但是当我从内部调用它时它不会发生。请注意，表格已创建（我可以告诉，因为我看到了来源）。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>title</title>
<style type="text/css">
#chessboard{margin:0;padding:0;border:2px solid #000}
#chessboard td{margin:0;padding:0;height:44px;width:42px;border:1px solid #000;background-repeat:no-repeat}
#chessboard td.ws{background-color:#ddd}
#chessboard td.bs{background-color:#999}
#chessboard td.bp{background-image:url('./pieces/bp.png')}
#chessboard td.br{background-image:url('./pieces/br.png')}
#chessboard td.bn{background-image:url('./pieces/bn.png')}
#chessboard td.bb{background-image:url('./pieces/bb.png')}
#chessboard td.bq{background-image:url('./pieces/bq.png')}
#chessboard td.bk{background-image:url('./pieces/bk.png')}
#chessboard td.wp{background-image:url('./pieces/wp.png')}
#chessboard td.wr{background-image:url('./pieces/wr.png')}
#chessboard td.wn{background-image:url('./pieces/wn.png')}
#chessboard td.wb{background-image:url('./pieces/wb.png')}
#chessboard td.wq{background-image:url('./pieces/wq.png')}
#chessboard td.wk{background-image:url('./pieces/wk.png')}

</style>
<script type="text/javascript">
var map="",i,ii,wsbs=true;
var abc=["a","b","c","d","e","f","g","h"];

map+="<div align=\"center\"><table id=\"chessboard\" cellpadding=\"0\" cellspacing=\"0\"><tbody>";
for(i=8;i>0;i--){
map+="<tr>";
for(ii=0;ii<8;ii++){
map+="<td id=\""+abc[ii]+""+i+"\" class=\"";
if(wsbs==true)map+="ws";else map+="bs";
map+="\">&nbsp;</td>";
if(ii!=7)wsbs=!wsbs;
}
map+="</tr>";
}
map+="</tbody></table></div>";

//document.write(map); works here

window.onload = function(){
document.write(map);
}

</script>
</head>
<body>
</body>
</html>

Answer 1

在页面加载后通过document.write()调用window.onload()时，您实际上会删除已呈现的页面。相反，您应该将页面上某些现有元素的innerHTML设置为map的内容。由于您有一个空的<body>，因此可以安全地写入正文innerHTML。否则，我建议您在<div>内创建一个占位符<body>，然后修改其innerHTML。

window.onload = function(){
  document.body.innerHTML = map;
}

Answer 2

您正在<head>中写表，因此您的浏览器不会对其进行解释。你需要在体内有这个：

<script>
document.write(map);
</script>

当我写'onload'时，为什么我的表没有显示？

2 个答案: