反应中的 iframe - JavaScript

什么是 iframe？

iframe 是 HTML 中的一个标签，它可以在页面中嵌入另一个网页。通过 iframe，可以将一个网页嵌入到另一个网页中，从而方便展示不同的内容。

如何在 JavaScript 中操作 iframe？

可以通过 JavaScript 操作 iframe 来实现动态加载新的页面，或者修改已经展示的页面。下面是一些常用的操作：

1. 获取 iframe 的引用

可以使用以下 JavaScript 代码来获取 iframe 的引用：

var iframeRef = document.getElementById('iframe-id');

其中，'iframe-id' 是 iframe 标签的 id。

2. 动态加载新的页面

可以使用以下 JavaScript 代码动态加载新的页面：

var iframeRef = document.getElementById('iframe-id');
iframeRef.src = 'http://www.example.com';

其中，'http://www.example.com' 是新页面的 URL。

3. 修改 iframe 中的内容

可以使用以下 JavaScript 代码修改 iframe 中的内容：

var iframeRef = document.getElementById('iframe-id');
iframeRef.contentWindow.document.body.innerHTML = 'New content';

其中，'New content' 是新的页面内容。

4. 监听 iframe 中的事件

可以使用以下 JavaScript 代码监听 iframe 中的事件：

var iframeRef = document.getElementById('iframe-id');
iframeRef.addEventListener('load', function() {
  console.log('iframe loaded!');
});

其中，'load' 是事件类型，可以监听其他类型的事件。

总结

iframe 可以方便地嵌入不同的网页，JavaScript 可以通过操作 iframe 实现动态加载新的页面或者修改已经加载页面的内容。也可以使用 JavaScript 监听 iframe 中的事件，从而实现更加复杂的功能。