Get HTML code using JavaScript with a URL

Question

I am trying to get the source code of HTML by using an XMLHttpRequest with a URL  How can I do that  I am new to programming and I am not too sure how can I do it without jQuery

User · Answer

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>

User · Answer

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  quot Msxml2 XMLHTTP quot       catch  error       try  return new ActiveXObject  quot Microsoft XMLHTTP quot       catch  error        throw new Error  quot Could not create HTTP request object  quot       var request   makeHttpObject    request open  quot GET quot    quot your url quot   true   request send null   request onreadystatechange   function       if  request readyState    4      alert request responseText

User · Answer

For an external  cross-site  solution  you can use  Get contents of a link tag with JavaScript - not CSS It uses   ajax   function  so it includes jquery

User · Answer

First  you must know that you will never be able to get the source code of a page that is not on the same domain as your page in javascript   See http   en wikipedia org wiki Same origin policy   In PHP  this is how you do it  file get contents  theUrl    In javascript  there is three ways   Firstly  by XMLHttpRequest   http   jsfiddle net 635YY 1  var url  quot    635YY quot  xmlhttp   Remember  same domain if  quot XMLHttpRequest quot  in window xmlhttp new XMLHttpRequest    if  quot ActiveXObject quot  in window xmlhttp new ActiveXObject  quot Msxml2 XMLHTTP quot    xmlhttp open  GET  url true   xmlhttp onreadystatechange function         if xmlhttp readyState  4 alert xmlhttp responseText      xmlhttp send null    Secondly  by iFrames   http   jsfiddle net XYjuX 1  var url  quot    XYjuX quot    Remember  same domain var iframe document createElement  quot iframe quot    iframe onload function         alert iframe contentWindow document body innerHTML     iframe src url  iframe style display  quot none quot   document body appendChild iframe    Thirdly  by jQuery    http   jsfiddle net edggD 2    get     edggD  function data   Remember  same domain       alert data         4

User · Answer

Edit  doesnt work yet    Add this to your JS  var src   fetch  https   page com    It saves the source of page com to variable  src

User · Answer

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      gt        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

[javascript] Get HTML code using JavaScript with a URL

Examples related to javascript

Examples related to html

Examples related to ajax

Examples related to url

Examples related to xmlhttprequest