Вариант 1: использование DOM
Для меня iframe.contentWindow.replaceChild(newDocumentElement, iframe.contentWindow.documentElement) не сработало (replaceChild не было методом, а iframe.contentWindow.documentElement.parentNode равно нулю).Мне удалось заменить голову и тело iframe:
var iframe = document.getElementById('preview');
var iframeDocument = iframe.contentDocument;
var head = document.createElement('head');
var body = document.createElement('body');
var library = document.createElement('script');
//library.src = 'https://latex.js.org/js/base.js';
library.src = 'https://d3js.org/d3.v4.min.js';
head.appendChild(library);
body.appendChild(document.createTextNode('Hello, World!'));
iframeDocument.head.parentNode.replaceChild(head, iframeDocument.head);
iframeDocument.body.parentNode.replaceChild(body, iframeDocument.body);
Вот скрипка: https://jsfiddle.net/zkb91faf/
Чтобы убедиться, что d3.v4.min.js загружен правильно, перейдите в iframe вотладчик (см. здесь для Chrome и здесь для Firefox ) и введите d3 в консоли.
Вариант 2: Использование src / srcdoc
Я был бы упущен, если бы не упомянул iframe.srcdoc.Похоже, вы просто используете статический HTML, поэтому это может быть уместно.
Вы просто установите его с помощью чего-то вроде:
iframe.srcdoc = newDocumentElement.outerHTML;
В качестве альтернативы,если вы хотите поддерживать старые браузеры, вы можете установить его через iframe.src и URI данных:
iframe.src = 'data:text;base64,' + btoa(newDocumentElement.outerHTML);
Если вам нужна поддержка юникода, обратитесь к https://developer.mozilla.org/en-US/docs/Web/API/WindowBase64/Base64_encoding_and_decoding
Примечание Использование относительных URL-адресов:
Вероятно, вы столкнетесь с проблемами при использовании относительных URL-адресов, например, в <link type="text/css" rel="stylesheet" href="css/article.css">, потому что у вашего iframe не будет правильного URI.Вы, вероятно, должны использовать абсолютные URL-адреса.
Обновление: добавление тегов скрипта после загрузки документа:
Похоже, виновник находится в base.js, , где вы присоединяете и запускаете код, основанный на событии DOMContentLoaded.DOM уже загружен, поэтому это событие не сработает.Что вы можете сделать, это проверить, загружено ли уже окно, и затем запустить код инициализации, если он есть.Через https://stackoverflow.com/a/9457996/6184972:
if (document.readyState === "complete" || document.readyState === "loaded") {
completed();
}
В этом случае вам может понадобиться заменить тело перед головой, на случай, если completed() выполнит какие-либо прямые манипуляции с DOM.