HTML中iFrame标签的两个用法介绍

最近在参与一个项目——布兜收藏夹，它让我有机会深入了解和实践了iframe的应用。简单来说，这个项目就是让用户能够收藏喜欢的图片到布兜页面。在此过程中，我对于iframe的应用有了更深的理解，并想与大家分享一些心得。

让我们谈谈iframe作为弹出层铺底覆盖的应用。在进行网页设计时，有时我们需要实现一个黑色遮罩覆盖整张页面的效果。如果在这种情况下，我们的用户使用的是IE6浏览器，并且页面上有select元素，那么问题就来了。弹出的DIV无法遮住select元素，这时候就需要我们的iframe出场了。

我们的策略是这样的：在与弹出div同一层级放入iframe，保证iframe的z-index小于弹层div的z-index。我们还需要增加window的resize和scroll事件，以确保iframe能够完全覆盖整个页面。

关于这部分的实现，部分关键代码是这样的：

```javascript

var iframe = U.isie6() ? '' : '';

$container.append(iframe).appendTo($body);

```

除此之外，我们还发现iframe在跨域写入cookie时也非常有用。假设我们有两个domain：a和b。在某些条件下，我们需要在a页面上展示b的部分功能。这时，如果需要操作a页面时对b domain的cookie进行写操作以方便用户下次访问，我们只需在a页面加入一个动态或固定的iframe，其src属性指向b的一个代理页面，然后在这个代理页面上执行cookie操作即可。

iframe在这个项目中扮演了非常重要的角色。它解决了我们在弹出层覆盖和跨域cookie操作上的难题，使得我们的布兜收藏夹项目能够顺利进行。以上就是我在此项目中对iframe应用的一些理解和心得。