一、 iframe的框架根据内容自适应高度
iframe是在项目设计中经常用到的框架标签。而它的作用就是把页面嵌套在自身形成的框架体中,从而实现在一个固定的地方可以切换多个页面,并且其他内容不变。在使用iframe这个框架标签时新手往往是直接固定iframe的宽高。那么当文本内容的长度不一样时就要一个一个地设置。当有上百个页面时这无疑是增加了代码量。而这个问题的解决方法也非常简单,我们只需要让它自适应高度就好。
二、 点击iframe内部页面进行页面跳转问题
iframe虽然可以嵌套多个页面,但也存在一个非常严重的问题。那就是iframe标签的页面跳转问题。正常情况下我们可以通过点击iframe框架区以外的地方来改变iframe嵌套的内容。但当我们在被iframe嵌套的页面里写window.location.href的页面跳转事件时,跳转的那个页面它不会覆盖掉当前的页面,而是被嵌套进iframe里。由于页面的宽度的百分比发生了变化,这对极大地影响被嵌套的页面的样式。
而不能让iframe内部嵌套的页面覆盖掉当前页面也是有原因的,因为这涉及到了安全性的问题。有iframe的一般都是主页面,如果让外来的页面把主页面覆盖掉,那么这个页面就可以对主页面进行操作,能够获取到主页面的信息。所以iframe內部嵌套的页面进行window.location.href的页面跳转时,跳转到的页面也会嵌套进iframe里面。
可当我们点击iframe里面的页面跳转到另一个页面需要把当前的页面覆盖掉时又该怎么办?这是我们可以通过点击a标签进行跳转;
三、点击iframe外部的页面进行iframe页面嵌套问题
这个问题是涉及到了iframe的主页面与其他页面的关联性。在首次加载主页面时我们可以在方法里用attr设置主页面的默认首次加载页面,然后再调用方法,这样就可以设置iframe首次加载的页面了。