Работающим и лучшим способом будет запись в IFRAME через JS:
<div id="target"></div>
<script>
document.getElementById("target").innerHTML = "<iframe id=\"my-frame\" src=\"about:blank\"></iframe>";
var frame = document.getElementById("my-frame");
var fdoc = frame.contentDocument;
fdoc.write("<!doctype html><head></head><body>Here is some content.</body></html>");
</script>
Обратите внимание, что это будет работать в Firefox и Chrome, Inte rnet Explorer будет скорее всего, запросит всплывающее окно безопасности ActiveX, которое должно быть принято пользователем.
Использование srcdoc
Вам не нужно (лучше сказал: вам не разрешено) экранировать символы HTML в srcdoc, поскольку это укажет браузеру отобразить символы «<» или «>», а не интерпретировать их как начало и конец тега. Вам нужно будет декодировать / отключить их раньше (я использовал ответ Владимира из другого SO для обработки декодирования), а затем убедитесь, что вы преобразовали кавычки в одинарные кавычки. Также убедитесь, что ответ API возвращает правильный HTML, поскольку то, что вы разместили в своем комментарии, является неполным, а знак двойной кавычки отсутствует в теге srcdoc.
function htmlDecode(input) {
var doc = new DOMParser().parseFromString(input, "text/html");
return doc.documentElement.textContent;
}
let div = document.getElementById("div");
let response = '<!DOCTYPE html>\n<html>\n <head>\n <script src="code.jquery.com/jquery-2.2.4.min.js" type="text/javascript"></script>\n<head><body>Some content.</body><html>';
div.innerHTML = "<iframe src=\"about:blank\" srcdoc=\"" + htmlDecode(response).replace(/"/g, "'") +"\"></iframe>";
<div id="div">
</div>