JavaScript中，iframe是非常重要的一个标签，他可以实现在当前页面中嵌入其他网页，实现跨域访问，添加广告，以及实现独立的url传参等功能。

举个例子来说，在一个网页中，你可以通过iframe引入其他页面，如下：

<iframe src="http://example.com"></iframe>

这会在当前页面中嵌入example.com这个网页，但是需要注意的一点是：由于同源策略的限制，如果引用的页面来源不同（比如说要引用的页面域名和当前页面域名不一样），那么就需要考虑csrf等问题。

而使用iframe的最常见的场景就是在一个页面中引入广告。比如我们举例来说一个网站，他需要在页面上引入Google Adsense的广告：

<iframe src="https://googleads.g.doubleclick.net/pagead/html/r20210113/r20190131/zrt_lookup.html#" width="970" height="90" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"></iframe>

由于广告组件实际上是存在于其他网站上的，即使我们想引入他，还需要真正获取到他的地址，然后使用iframe把他嵌入到我们的网页上。

而有时候我们还需要在一个iframe中加入一些快速访问url的链接，这时候需要使用javascript的postMessage方法，把我们需要的链接通过一个数组，传入到一个空白的url中：

var links = ['https://google.com', 'https://baidu.com'];
var iframe = document.createElement('iframe');
iframe.src = 'about:blank';
document.body.appendChild(iframe);
window.addEventListener('message', function(event) {
console.log(event.data);
});
iframe.contentWindow.postMessage(links, '*');

这会在新建的iframe中，加载一个空白的页面，监听iframe的消息事件，并传入一个links数组。接下来，在iframe中需要添加一个url列表，用来访问其他的网址。这时候需要在iframe中检测消息事件，并更新iframe中的html：

window.addEventListener('message', function(event) {
links = event.data;
var html = '';
for (var i = 0, l = links.length; i< l; i++) {
var link = links[i];
html += '<a href="' + link + '">' + link + '</a>';
}
document.body.innerHTML = html;
});

这段代码使用了循环来构建一个html字符串，之后设置到document.body上，实现了快速访问url的链接效果。

除此之外，iframe还有很多其它的使用，比如说发送ajax请求，或者使用 iframe 实现 preview 等。

总之，iframe在JavaScript中是非常重要的一个标签，在很多的场景下，都可以发挥出非常重要的作用，我们需要多多关注和学习。