<div></div><iframe></iframe> iframe嵌入的页面中的数据怎么传到div中来
时间: 2023-09-01 11:09:38 浏览: 45
要将iframe中的数据传输到div中,您可以使用JavaScript的postMessage()方法。在iframe中,使用postMessage()方法向父页面发送数据。在父页面中,使用window.addEventListener()方法侦听来自子页面的消息,并将消息存储在div中。
以下是一个示例代码:
在iframe中:
```
var data = "Hello World!";
parent.postMessage(data, "*");
```
在父页面中:
```
window.addEventListener("message", function(event) {
if (event.origin !== "http://example.com") // 验证消息来源
return;
var div = document.getElementById("myDiv");
div.innerHTML = event.data;
}, false);
```
在这个例子中,iframe向父页面发送了一条消息"Hello World!",并将其存储在id为"myDiv"的div中。请注意,如果您不验证消息来源,可能会受到跨站点脚本攻击(XSS)的风险。因此,请始终验证消息来源。
相关问题
<div></div><iframe></iframe> iframe嵌入的页面中的数据怎么传到div中来 用vue的方法
在Vue中,将iframe中的数据传输到div中,您可以使用`postMessage()`方法。在iframe中,使用`postMessage()`方法向父页面发送数据。在父页面中,使用`window.addEventListener()`方法侦听来自子页面的消息,并将消息存储在div中。
以下是一个示例代码:
在子组件中:
```
mounted() {
const data = "Hello World!";
window.parent.postMessage(data, "*");
}
```
在父组件中:
```
mounted() {
window.addEventListener("message", (event) => {
if (event.origin !== "http://example.com") // 验证消息来源
return;
const div = document.getElementById("myDiv");
div.innerHTML = event.data;
});
}
```
在这个例子中,子组件向父页面发送了一条消息"Hello World!",并将其存储在id为"myDiv"的div中。请注意,如果您不验证消息来源,可能会受到跨站点脚本攻击(XSS)的风险。因此,请始终验证消息来源。
<body> <div> <iframe src="//player.bilibili.com/player.html?aid=5758649&bvid=BV1Ps411y78M&cid=9350356&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe> </div> </body>视频没显示怎么办
如果您嵌入的视频没有显示,可能是由于以下原因之一:
1. 您的网络连接不稳定或中断,导致视频无法加载。
2. 您的浏览器不支持视频格式。
3. 您未正确嵌入视频代码,或者代码中的链接无效。
您可以尝试以下步骤来解决问题:
1. 确保您的网络连接正常,尝试重新加载页面。
2. 检查视频格式是否受支持,并尝试在其他浏览器中查看视频。
3. 重新检查您的代码,确保嵌入的链接是有效的。
如果以上方法都无法解决问题,您可以尝试联系视频提供者或网站管理员以获取更多帮助。