我正在尝试编写一个iFrame作为chrome中浏览器内HTML / Javascript / CSS IDE中的测试区域,但由于某些错误我失去了很多功能,我想知道是否有人可以告诉我如何将iFrame的.src属性设置为具有直接在.src属性中编码的html Javascript CSS等代码的URL。 不要告诉我它无法完成,因为我知道它可以,我只是丢失了我发现这种方法的网页。 另外,作为旁注,是否可以通过编程方式强制刷新此iFrame?

感谢您的时间,

克里斯

===============>>#1 票数:6 已采纳

根据我的研究,它看起来像是一种安全风险,所以在所有浏览器中都不允许这样做。

MS IE网站链接摘录:

仅支持以下元素和/或属性的数据URI。

  • 对象(仅限图像)
  • IMG
  • 输入类型=图像
  • 链接
  • 接受URL的CSS声明,例如background,backgroundImage等。

HTML5安全备忘单: http//html5sec.org/

===============>>#2 票数:4

iframeEl.src =“data:text / html; charset = utf-8,”+ content;

===============>>#3 票数:2

是的,可以这样做 - 请参阅http://sparecycles.wordpress.com/2012/03/08/inject-content-into-a-new-iframe/

请注意,iframe将与原始页面具有相同的来源,这可能是不合需要的,并且可能具有严重的安全性考虑因素,具体取决于您正在执行的操作。

使用javascript:scheme技术的一个例子是: http//jsbin.com/uhenuz/4 (如果与https一起使用则需要额外的谷歌搜索和良好的测试来检查混合的https / http警告永远不会出现。)

===============>>#4 票数:2

请改用srcdoc属性,您可以在其中srcdoc原始HTML。

演示

<iframe srcdoc="<h1>HELLO</h1>"></iframe>
<iframe id="dynamic"></iframe>
<script>document.getElementById('dynamic').srcdoc = '<i>there</i>';</script>

适用于除MS浏览器之外的所有内容。
使用sandbox使其更安全。

===============>>#5 票数:-1

刷新iframe:

document.getElementById('iframeid').src = document.getElementById('iframeid').src

  ask by user1030453 translate from so

未解决问题?本站智能推荐:

1回复

使用javascript在Chrome中触发iframe中的文件输入

我正在尝试解决我公司的Web框架中丑陋的浏览器特定上传按钮。 我创建的是隐藏的iframe,其中包含一个表单。 iframe之外是“选择文件”按钮。 该按钮从iframe中检索输入元素,并在其上调用“click()”。 单击将打开IE和FF中的文件选择对话框,但不会在Chrome
2回复

使用文件协议调用Chrome中iframe中定义的JavaScript函数

这个问题非常类似于这里提出的问题的完全更新版本: 如何在Chrome / Webkit中使用文件协议将JavaScript函数从一个帧调用到另一个帧 - 遗憾的是,这个问题从未真正回答过。 我有一个HTML页面,其中包含iframe中的SVG图像。 SVG导出一个JavaScript A
1回复

如何使用javascript以编程方式从iframe中删除sandbox属性

我不认为这是可能的,但是,我找到了这个引用: “强烈建议不要同时使用allow-scripts和allow-same-origin,因为它允许嵌入式文档以编程方式删除沙盒属性。” 我的iframe需要有一个沙箱,但只有当我浏览某些URL时,嵌入式浏览上下文会尝试将内容导航(加载
1回复

在Firefox中使用javascript但在chrome中正确使用时,html数据属性未按预期显示

我希望以下代码: 在检查器中显示如下: 它在Chrome中的作用。 但在FireFox中,它显示如下: 任何人都可以解释为什么会这样,以及它是否会以相同的方式与任何一种表示相同
1回复

使用JavaScript和Google Chrome API将剪贴板数据存储到变量中

我想知道是否可以将剪贴板的内容存储在字符串变量中。 以下消息来源指出,使用纯JS不可能做到这一点,但是我在 想, 希望chrome API能够实现这一目标。 (我正在开发chrome扩展程序)。 如何在跨浏览器中读取剪贴板数据? 有一个clipboard
1回复

Chrome扩展程序中的持久iFrame

有没有人碰巧知道Chrome扩展程序中是否有持久的iFrame? 目前我在背景页面中运行iFrame,但我希望能够让用户看到它(它是一个视频播放器,所以即使正在播放视频,用户也无法点击控件)。 目标是,如果用户关闭了扩展程序的弹出窗口,则视频仍然是播放器,当他们再次点击弹出窗口时,视频仍在播
2回复

在嵌入中绑定src在Chrome中不起作用

我正在使用AngularJs来构建网页,它在IE和firefox中可以正常工作,但是当我在chrome中尝试时,它就无法正常工作。 我想知道为什么它不能在chrome中工作,以及是否有可能的解决方法。 的HTML Java脚本 编辑错误
2回复

如何在JavaScript for Chrome中设置innerText?

我正在尝试在Chrome中在元素的开始标记和结束标记之间设置innerText,但是到目前为止,它不起作用。 这是为什么? 我已经尝试过这些: 这是小提琴: http : //jsfiddle.net/La1tadpd/
2回复

src问题(未知)-Chrome中的图像损坏

当我尝试显示图像时,Chrome中的行为异常。 我看到一些破像这样的小徽章: 这只是破碎的图片。 以前,它在chrome中无法正常工作。 我使用一些JavaScript代码来处理未找到的图像: 在HTML中: 但是,它仅在我执行“清除缓存”和“硬刷新”时才第
1回复

Chrome浏览器不支持使用JavaScript设置表格宽度

Chrome似乎不支持我在表上设置的.width()设置。 IE10可以。 页面加载完成后,我得到表格的宽度:425px。 然后,我删除内容最宽的行,从而使表重新绘制,并且表的宽度缩小:185px。 然后,我将表格的宽度设置为原始值425px。 但是,如果我在设置后检查表格的宽