Load page content to variable

Question

Good day.

I never really got a good hand at JavaScript, therefore this unusual and simple question.

How can i load a page content t

Answer 1

To get everything inside the html tags:

var html = document.getElementsByTagName('html')[0];
var text = html.innerHTML;

Then you can wrap that in html tags. Doesn't capture doctype or anything else you'd have outside the html tags, but it's a quick way to grab most of the content.

Answer 2

I know this question is really old now, but I have had the same issue with trying to get the page contents into a variable, but have finally figured out a way in Javascript :D (With some help from the internet ...)

So here it goes ...

I made a function with a callback to get a desired page:

function getPageContents(callback,url,params) {
    http=new XMLHttpRequest();
    if(params!=null) {
        http.open("POST", url, true);
        http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    } else {
        http.open("GET", url, true);
    }
    http.onreadystatechange = function() {
        if(http.readyState == 4 && http.status == 200) {
            callback(http.responseText);
        }
    }
    http.send(params);
}

Note that I have made it in such a way, that it wont accept GET paramaters. This is intentional, as I have no need to use GET for my application. If params are set, these will be sent as POST.

Then to use the function, lets say I want to post a name to findpersoninfo.php which will output a JSON array of that persons info, I can do this:

getPageContents(function(result) {
    personinfo=JSON.parse(result);
    //Now I can do anything here with the personinfo array
},'http://localhost/findpersoniinfo.php','fname=stretch&lname=wright')

Taking it a step further, you can nest this inside another function, lets call it getPersonInfo():

function getPersonInfo(fname,lname) {
    getPageContents(function(result) {
        personinfo=JSON.parse(result);
        //Now I can do anything here with the personinfo array
    },'http://localhost/findpersoninfo.php','fname='+fname+'&lname='+lname)
}

Of course, my knowledge of Javascript is still in it's infancy, and welcome any constructive feedback :D

Answer 3

A simple solution to download JSON data from a url like /v1/data?format=json:

xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET", "/v1/data?format=json", false);
xmlhttp.send();
var data = JSON.parse(xmlhttp.responseText);

Answer 4

This is a modified version of an example you can find at w3schools.com.

<script type="text/javascript">
    function loadXMLDoc(theURL)
    {
        if (window.XMLHttpRequest)
        {// code for IE7+, Firefox, Chrome, Opera, Safari, SeaMonkey
            xmlhttp=new XMLHttpRequest();
        }
        else
        {// code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function()
        {
            if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
                alert(xmlhttp.responseText);
            }
        }
        xmlhttp.open("GET", theURL, false);
        xmlhttp.send();
    }
</script>

So just make "example.html" be any sort of path (relative or absolute) to the page you want to load, and xmlhttp.responseText will be a string containing the response content. You can also use xmlhttp.responseXML if you want it to be stored as a traversable XML document. Anyway, just assign either of those to a variable of your choice, and you will have it!

Note that 'loadXMLDoc' does not return anything directly but defines one of its members ('onreadystatechange') to do that job, and to does it only in certain condition (readyState and status). Conclusion - do not assign the output of this function to any var. Rather do something like:

var xmlhttp=false;
loadXMLDoc('http://myhost/mycontent.htmlpart');
if(xmlhttp==false){ /* set timeout or alert() */ }
else { /* assign `xmlhttp.responseText` to some var */ }

Without that, all one can see is 'undefined'...