Как добавить HTML-контент в новый созданный Iframe в JS

Question

Я создаю Iframe и пытаюсь добавить Html в его тело, но постоянно получаю сообщение об ошибке Невозможно прочитать тело свойства с нулевым значением .

Мой код выглядит примерно так:

var frameToPrint = document.createElement("IFRAME") as HTMLFrameElement;
frameToPrint.contentDocument.body.innerHTML = "";

Это работает, если я добавлю Iframe в свой HTML, а затем получу его с помощью GetElementById, но я не могу отобразить этот Iframe на своей странице.Даже скрытый, он портит мои размеры.

Заранее спасибо!

Answer 1

Я нашел ответ.Вам нужно добавить новый созданный фрейм к вашему телу.Это инициализирует contentWindow и contentDocument в iframe.

var frameToPrint = document.createElement("iframe");
		frameToPrint.setAttribute("name", "prnt");
		document.body.appendChild(frameToPrint);

Answer 2

iframe является пустым элементом при создании.Он не знает, что это должен быть (для вас) html-документ.Поэтому у него нет тела, к которому вы можете добавить.

Там у меня в качестве примера приведен фрагмент.

---

1. создайте элемент iframe: var iframe = document.createElement("iframe");
2. создайте элемент body: var body = document.createElement("body");
3. создайте контент, который вы хотите добавить: напр .: var body = document.createElement("body");
4. Заполните ваш контент фактическим содержанием: content.textContent = "Some Text";

И после этого вы просто добавляете его соответственно в свой элемент iframe

var iframe = document.createElement("iframe"); 
var body = document.createElement("body");
var content = document.createElement("p");
content.textContent = "Some Text";

body.appendChild(content);
iframe.appendChild(body);

console.log(iframe.innerHTML);