0

I am trying to get HTML source with JavaScript:

Why this does not work?:

<!DOCTYPE html>
<html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  <script>
    function MyGetHTML()
      {
        $.get("www.example.com/test1.html", function(data){
          return data;
        });
      }
  </script>
</head>

<body>
  test 30.9.2015
  <script>
    alert(MyGetHTML());
  </script>
</body>
</html>
user1580348
  • 5,721
  • 4
  • 43
  • 105
  • It's an async ajax call. You won't get response as soon as you invoke it. – vijayP Sep 30 '15 at 15:17
  • @SterlingArcher It's only a test. – user1580348 Sep 30 '15 at 15:18
  • 2
    Note you can only use Ajax for sites on *other domains* that explicitly allow you to do so. (Same Origin Policy) – Alex K. Sep 30 '15 at 15:20
  • possible duplicate of [How to return the response from an asynchronous call?](http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-asynchronous-call) – Dave Sep 30 '15 at 15:20
  • You can read more about it here: http://www.ajax-cross-origin.com/ – Payer Ahammed Sep 30 '15 at 15:22
  • There are two issues here: You don't seem to be aware of how Ajax works and you are trying to "load" a third-party domain. Both of these have been covered on Stack Overflow extensively. In your actual code, are you planning to get the source of "external" pages? – Felix Kling Sep 30 '15 at 15:25

2 Answers2

1

(Below, i'm assuming that you need to get content from filen IN your source, from the same origin of your page.)

Your code doen't works because the the return of your MyGetHTML method is the get request itself, and the success callback of your request returns the data.

You could do:

function MyGetHTML(){
    $.get("www.example.com/test1.html", function(data){
      //alert(data);
      //or use console.log() instead.
      console.log(data);
    });
  }

And then

MyGetHTML(); //This will log your data after the succesfull request.

Further reading: https://api.jquery.com/jquery.get/

Hint on your use case:

A simple tutorial from Tuts+ on making simple ajax requests.

With pure JS:

load('test.html', function(xhr) {
    document.getElementById('container').innerHTML = xhr.responseText;
});

function load(url, callback) {
        var xhr;

        if(typeof XMLHttpRequest !== 'undefined') xhr = new XMLHttpRequest();
        else {
            var versions = ["MSXML2.XmlHttp.5.0", 
                            "MSXML2.XmlHttp.4.0",
                            "MSXML2.XmlHttp.3.0", 
                            "MSXML2.XmlHttp.2.0",
                            "Microsoft.XmlHttp"]

             for(var i = 0, len = versions.length; i < len; i++) {
                try {
                    xhr = new ActiveXObject(versions[i]);
                    break;
                }
                catch(e){}
             } // end for
        }

        xhr.onreadystatechange = ensureReadiness;

        function ensureReadiness() {
            if(xhr.readyState < 4) {
                return;
            }

            if(xhr.status !== 200) {
                return;
            }

            // all is well  
            if(xhr.readyState === 4) {
                callback(xhr);
            }           
        }

        xhr.open('GET', url, true);
        xhr.send('');
    }

Or with jquery library

$('#container').load('test.html');
Filipe Merker
  • 2,428
  • 1
  • 25
  • 41
-2

Because you're returning to the get not the function itself. Try like this:

 function MyGetHTML()
      {

        var datum = '';

        $.get("www.example.com/test1.html", function(data){
          datum = data;
        });

       return datum;
      }
Victor Levin
  • 1,167
  • 6
  • 11