Upload another html doc instead of the current one using pure Javascript

Question

Upload another html doc instead of the current one using pure Javascript

Navigation

#1 by (0 votes)

1

In facul's work, I'm making an app with several menus, if I'm doing everything in a single html, it's going to be a huge file. So by clicking the options on a particular menu, I'd like to continue running the app with another html document, loaded instead of the current one. Could you do with html with something like: < a href ..... / > right?

But I'd like to do this within a javascript function, which is triggered by clicking a button on a menu. Here's the snippet of my code:

    <div class="menu" id="menuCorNaoCor" style="display:none">
            <div class="centralizar">
                <button class="botao" onClick="carregarMenuCorrentista()"> Correntista </button>
                <button class="botao" > Não Correntista </button>
            </div>
    </div>

<script>
        function carregarMenuCorrentista(){
          //Carrega o menu, que está em outro documento html
        }

</script>

javascript html html5

asked by anonymous 22.04.2018 / 21:36

1 answer

Limit number of bootstrap mode characters laravel 5.4 passport - authentication 3rd party login

score 0 · Accepted Answer

Put this Ajax function in pure JS, replacing pagina.html with the page you want to load. This will replace the entire page with Ajax's return:

if(navigator.appName == "Microsoft Internet Explorer"){
    var http = new ActiveXObject("Microsoft.XMLHTTP");
}else{
    var http = new XMLHttpRequest();
}

var url_ = "pagina.html";
http.open("GET", url_, true);
http.onreadystatechange = function(){
   if(http.readyState == 4){
      document.querySelector("html").innerHTML = http.responseText;
   }
}
http.send(null);