SCRIPT5007：无法获取未定义或 null 引用的属性“parentNode”的解决办法

  今天上午学习EXTJS，主要是为了了解下extjs的布局，所以我复制了下面这些代码到javascrpt 中。

var viewport = new Ext.Viewport({
	layout: 'border',
	renderTo: 'mygrid',
	items: [{
	region: 'north',
	xtype: 'panel',
	html: 'North'
	},{
	region: 'west',
	xtype: 'panel',
	split: true,
	width: 200,
	html: 'West'
	},{
	region: 'center',
	xtype: 'panel',
	html: 'Center'
	},{
	region: 'east',
	xtype: 'panel',
	split: true,
	width: 200,
	html: 'East'
	},{
	region: 'south',
	xtype: 'panel',
	html: 'South'
	}]
	});

   可是打开网页的时候，没有布局效果显示，打开开发工具的控制台，提示 SCRIPT5007: 无法获取未定义或 null 引用的属性“parentNode” （这是在IE上的报错，chrome上的是 Uncaught TypeError: Cannot read property 'parentNode' of null）。在我BD和GG了几个小时后，总算找到个靠谱的解释。

   错误的原因我也说不怎么清楚，大概是这样的：在浏览器还没有创建DOM对象之前你就试图获取对象.。

既然知道原因了，那我也就知道怎么解决这个问题了。解决办法有2个：

1.将这段script代码写到最靠近</body>但是在它之前，这个是为了等到DOM对象创建完毕后才加载这段js代码。

2.将这段js代码写成独立的js文件，然后在html底部，即</body>之前外链接上该js文件。

附上我BD的相关资料：

http://zhidao.baidu.com/link?url=JO0SOo-4pmQ5DXgh9yLE6pIj0hdLSN1r4kQl7lLkMGxWMet5pfSvZUNeOyxSukics-5hBVLHJQg3eCyIa54LH_