Как отобразить HTML-файл в JavaScript?

Question

Я пытаюсь отобразить html-файл в моем js-коде.

Это обычный HTML-файл, который я хотел бы увидеть.Я уже создал IFRAME для этого, но каким-то образом я не могу идти дальше ...

Это мой фрагмент кода:

var controlAddIn = document.getElementById('controlAddIn').src = 'index.html';

Итак, файл, который я хочу вызвать, это "index.HTML».Но это не работает.

Если я назову это так:

var controlAddIn = document.getElementById('controlAddIn').srcdoc = '<div><meta charset="UFT-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"></div>';

Это работает, но это очень затрудняет чтение ... У вас есть идея,как я могу назвать весь мой код на этом этапе, также многострочный?

Answer 1

Вы можете использовать запрос XMLHttp для получения содержимого файла Html, этот код async

function httpGet(theUrl,callback)
   {
       var xmlHttp = new XMLHttpRequest();
       xmlHttp.open( "GET", theUrl, true ); // false for synchronous request
       xmlHttp.send( null );
       xmlHttp.onreadystatechange = function() {
          callback(xmlHttp.responseText);
       };
    }
  var controlAddIn;
  httpGet("index.html",function(content){
     controlAddIn = document.getElementById('controlAddIn').src =content;
  });

Answer 2

Оба файла должны иметь один и тот же путь, если вы звоните так, как если бы у вас был правильный путь

var controlAddIn = document.getElementById('controlAddIn').src = 'index.html';

сохраните этот файл в пути index.html иоткройте его в браузере

<script type="text/javascript">

function newSite() {


    document.getElementById('myIframe').src = "index.html"
}    
</script>

<input type="button" value="Change site" onClick="newSite()" />
<iframe id="myIframe" src="http://google.com/" ></iframe>