javascript执行顺序导致页面加载效果失败的问题

练习用JS动态创建表格放入指定的div中时，表格始终出不来，最后发现是因为js 代码在页面还没有加载完成时函数代码块就已经运行了，所以创建的table元素找不到指定的div。
显示失败的代码如下：

<script type="text/javascript">
var arr=[['id','名称','血量','伤害'],['1','gareen','340','58'],['2','teemo','320','56'],['3','annie','380','38'],['4','deadbo','400','90']];
var table=document.createElement("table");
for(var i=0;i<arr.length;i++){
	var tr=document.createElement("tr");
	for(var j=0;j<arr[i].length;j++){
		var td=document.createElement("td");
		var text=document.createTextNode(arr[i][j]);
	    td.appendChild(text);
		tr.appendChild(td);
	}
	table.appendChild(tr);
}
var showtable=document.getElementById("showtable");
showtable.appendChild(table);
//document.getElementsByTagName("body")[0].appendChild(table);这种方法也可以将表格添加到body元素当前的位置
</script>
<div id="showtable">
</div>

解决办法：使用window.onload，在文档加载完成后能立即触发，window.onload =function (){写要在页面加载完成后执行的代码};
或者将JS代码放在HTML元素的后面。