Extjs的问题

为什么只显示下面body的内容
[code=JSP]<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 <title>55</title>
        <!-- 引入必要的Ext库文件-->
         <link rel="stylesheet" type="text/css" href="../css/ext-all.css" />
        <script src="../js/ext-base.js">
        </script>
        <script src="../js/ext-all.js">
        </script>
        <script type="text/javascript" src="localXHR.js"></script>
        <script>
         
         Ext.onReady(function(){
          var cm=new Ext.grid.ColumnModel([
          {header:'编号',dataIndex:'id'},
          {header:'名称',dataIndex:'name'},
          {header:'描述',dataIndex:'descn'}
          ]);
          
          var data=[
          ['1','张三','NB'],
          ['2','李四','HNB'],
          ['3','麻子','gnb']
          ];
          
          var ds=new Ext.data.Store({
          proxy:new Ext.data.MemoryProxy(data),
          reader:new Ext.data.ArrayReader({},[
          {name:'id'},
          {name:'name'},
          {name:'descn'}
          ])
          });
          ds.load();
          
          var grid=new Ext.grid.GridPanel({
          ds:ds,
          cm:cm,
          region:'north'
          });
          
          var tree=new Ext.tree.TreePanel({
          loader:new Ect.tree.TreeLoader({dataUrl:''}),
          title:'west',
          region:'west',
          split:true,
          border:true,
          collapsible:ture,
          width:200,
          minSize:80,
          maxSize:200
          });
          
          var root=new Ext.tree.AsyncTreeNode({text:'总节点'});
          tree.setRootNode(root);
          root.expand();
          
          var form = new Ext.form.FormPanel({
        defaultType: 'textfield',
        labelAlign: 'right',
        title: 'form',
        labelWidth: 50,
        frame:true,
        width: 220,        title: 'center-center',
        region: 'center',        items: [{
            fieldLabel: '文本框',
            anchor: '90%'
        }],
        buttons: [{
            text: '按钮'
        }]
    });
          
          var viewport=new Ext.Viewport({
          layout:'border',
          items:[{
          region:'north',
          contentEl:'Ndiv',
          height:80,
          bodyStyle: 'background-color:#BBCCEE;'
          },{
          region:'south',
          contentEl:'Ediv',
          height:30,
          bodyStyle: 'background-color:#BBCCEE;'
          },tree,{
          region:'center',
          split:true,
          border:true,
          items:[grid,form]
          }]
          });
              
         });
         
      
        </script>
        
</head>
<body>
<div id='Ndiv'>顶部</div>
<div id='Sdiv'>底部</div>
</body>
</html>[/code]