js创建的元素无法显示的问题

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
     var board = document.getElementById("board");
     var e = document.createElement("input");
     e.type = "button";
     e.value = "这是测试加载的小例子";
     board.appendChild(e);
 </script>
</head><body>
<div id="board">科目</div>
</body>
</html>
这儿的创建的input元素为什么无法在div处显示？？
js的帮助文档没有appendChild(chileNode)方法，这是以前的版本中的方法吗？？？

解决方案 »

  1.   

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <script type="text/javascript">
    window.onload=function(){
      var board = document.getElementById("board");
      var e = document.createElement("input");
      e.type = "button";
      e.value = "这是测试加载的小例子";
      board.appendChild(e);
    }
     </script>
    </head><body>
    <div id="board">科目</div>
    </body>
    </html>
      

  2.   

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head><body>
    <div id="board">科目</div>
    <script type="text/javascript">
      var board = document.getElementById("board");
      var e = document.createElement("input");
      e.type = "button";
      e.value = "这是测试加载的小例子";
      board.appendChild(e);
     </script>
    </body>
    </html>原因是document.getElementById在调用的时候，board元素还没有创建，所以正常的做法是放到<div></div>之后，另外一种做法是放到整个页面加载结束onload方法里。
      

  3.   

    1楼和3楼解释的很清楚了，建议楼主去看看浏览器加载html的顺序问题