Установка атрибута iFrame src в качестве кодированного URI данных с javascript в chrome

Я пытаюсь кодировать iFrame как тестовую область в HTML/Javascript/CSS IDE в браузере в Chrome, но я теряю много функциональности из-за определенных ошибок, и мне было интересно, может ли кто-нибудь сказать мне, как установить атрибут.src iFrame на URL с кодом HTML javascript CSS, закодированным непосредственно в атрибуте.src. Не говорите мне, что это невозможно, потому что я знаю, что может, я просто потерял веб-страницу, где нашел этот метод. Кроме того, как побочная заметка, можно ли программно заставить этот iFrame обновляться?

Спасибо за ваше время,

Крис

Ответ 1

Из моего исследования видно, что это считается угрозой безопасности и поэтому запрещено во всех браузерах.

Отрывок ссылки на сайт MS IE:

URI данных поддерживаются только для следующих элементов и/или атрибутов.

объект (только изображения)

IMG

тип ввода = изображение

ссылка на сайт

Объявления CSS, которые принимают URL, такие как background, backgroundImage и т.д.

Лист безопасности HTML5: http://html5sec.org/

Ответ 2

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

Ответ 3

Да, это можно сделать - см. Http://sparecycles.wordpress.com/2012/03/08/inject-content-into-a-new-iframe/

Обратите внимание, что iframe будет иметь то же происхождение, что и исходная страница, что может быть нежелательно и может иметь серьезные соображения безопасности в зависимости от того, что вы делаете.

Пример использования метода javascript: scheme приведен здесь: http://jsbin.com/uhenuz/4 (Если для использования с https потребуется дополнительный поиск в googling и хорошее тестирование, чтобы проверить, что смешанное предупреждение https/http никогда не появится.)

Ответ 4

srcdoc этого srcdoc атрибут srcdoc, вы можете просто вставить в него необработанный HTML.

демонстрация

Работает во всем, кроме браузеров MS.

Ответ 5

Обновить iframe:

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