Get HTML code using JavaScript with a URL Get HTML code using JavaScript with a URL ajax ajax

Get HTML code using JavaScript with a URL


Use jQuery:

$.ajax({ url: 'your-url', success: function(data) { alert(data); } });

This data is your HTML.

Without jQuery (just JavaScript):

function makeHttpObject() {  try {return new XMLHttpRequest();}  catch (error) {}  try {return new ActiveXObject("Msxml2.XMLHTTP");}  catch (error) {}  try {return new ActiveXObject("Microsoft.XMLHTTP");}  catch (error) {}  throw new Error("Could not create HTTP request object.");}var request = makeHttpObject();request.open("GET", "your_url", true);request.send(null);request.onreadystatechange = function() {  if (request.readyState == 4)    alert(request.responseText);};


There is a tutorial on how to use Ajax here: https://www.w3schools.com/xml/ajax_intro.asp

This is an example code taken from that tutorial:

<html><head>    <script type="text/javascript">        function loadXMLDoc()        {            var xmlhttp;            if (window.XMLHttpRequest)            {              // Code for Internet Explorer 7+, Firefox, Chrome, Opera, and Safari              xmlhttp = new XMLHttpRequest();            }            else            {                // Code for Internet Explorer 6 and Internet Explorer 5                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");            }            xmlhttp.onreadystatechange=function()            {                if (xmlhttp.readyState==4 && xmlhttp.status==200)                {                    document.getElementById("myDiv").innerHTML = xmlhttp.responseText;                }            }            xmlhttp.open("GET", "ajax_info.txt", true);            xmlhttp.send();        }    </script></head><body>    <div id="myDiv"><h2>Let AJAX change this text</h2></div>    <button type="button" onclick="loadXMLDoc()">Change Content</button></body></html>


You can use fetch to do that:

fetch('some_url')    .then(function (response) {        switch (response.status) {            // status "OK"            case 200:                return response.text();            // status "Not Found"            case 404:                throw response;        }    })    .then(function (template) {        console.log(template);    })    .catch(function (response) {        // "Not Found"        console.log(response.statusText);    });

Asynchronous with arrow function version:

(async () => {    var response = await fetch('some_url');    switch (response.status) {        // status "OK"        case 200:            var template = await response.text();            console.log(template);            break;        // status "Not Found"        case 404:            console.log('Not Found');            break;    }})();