多TAB页管理管理后台 用iframe加载页面使用注意事项：iframe高度自适应，内外部js相互调用等

很多WEB应用管理后台都是基于多TAB页来实现的，页面布局类似下图所示：

多TAB页通常就两种实现方式：

• div容器方式： TAB页内容只是整个页面的一个div节点，共享js和css，因此该方式实现难度较大，但是性能、安全性比较好，该实现方式必须解决：js命名空间问题。
• iframe容器模式： 每个TAB页加载一个iframe，iframe加载目标页面，该方式实现简单，性能、安全性稍差；因为简单、简单、简单，所以很多企业信息化WEB应用管理后台都是基于此方式实现。

虽说基于iframe容器模式实现相对简单，但是实际项目应用中，我们还是需要注意下述几个问题。

1、iframe高度自适应问题

在个别浏览器（比如早期版本的chrome浏览器），iframe的height设置100%，并不会将高度拉伸到到iframe父容器的高度，因此需要在生成TAB页的时候，用js代码显性设置iframe高度，参考代码如下：

//