jQuery load() gives empty results with Greasemonkey

Question

I'm trying to load an external page and parse the HTML:

var $f = jQuery().load("http://google.com");
alert($f.text());

But the alert box doesn't show anything, and length is zero.

I'm using Greasemonkey 0.9.13 and jQuery 1.7.1

What am I doing wrong?

Note from OP comment, below: "script is executed from same domain. google is only an example"

Ansel Santosa · Answer 1 · 2012-01-05T02:04:27.707

2

Due to the same origin policy, most AJAX requests cannot successfully retrieve data from a different domain. (The external server must be setup to specifically facilitate cross-domain requests.). See the notes in the API spec for .load().

Edit: If some origin policy is followed, your JS still isn't quite right. .load() doesn't return the AJAX result, it inserts it into the preceding element in the chain. So:

var $f = $('div');
    $f.load("/somepath", function() {
        // do something with the subtree of $f
    });

edited Jan 05 '12 at 02:04

answered Jan 05 '12 at 00:56

Ansel Santosa

8,224
1
28
39

I reading about that. but, script is executed from same domain. google is only an example – papelucho Jan 05 '12 at 01:17
Oh okay. In that case, see my edit for a working version of your code. – Ansel Santosa Jan 05 '12 at 02:04

score 0 · Answer 2 · answered Jan 05 '12 at 00:57

0

It won't work at all if it's cross domain, unless you use gm_xmlhttprequest but if it's not you can accomplish what you're trying with the following:

$.get('http://google.com', function(data) {
    alert($(data).text());
});

answered Jan 05 '12 at 00:57

qwertymk

34,200
28
121
184

thanks... but this doesn't work, alert box doesn't appear. apparently the way is to use gm_xmlhttprequest – papelucho Jan 05 '12 at 01:11

Brock Adams · Accepted Answer · 2012-01-05T02:38:18.470

As others have pointed out, jQuery load() (and most other jQuery AJAX) does not work cross domain. You say that's not a factor here, but it will be in the future or for others.

The more immediate problem with that code:

var $f = jQuery().load("http://google.com");
alert($f.text());

Is that load() is not synchronous. That first line of code starts a process but execution immediately drops to the alert() statement -- long before the load() process finishes.

Get around both problems by using GM_xmlhttpRequest().

So your code would become:

var pageText;

GM_xmlhttpRequest ( {
    method:         'GET',
    url:            'http://google.com',
    onload:         function (responseDetails) {
                        pageText = responseDetails.responseText;

                        //-- This will alert the page contents.
                        alert (pageText);
                    }
} );

//--- This will alert nothing.
alert (pageText);

Just be sure to process the text inside the onload handler.

If you really must have the code wait for the loaded page (not recommended), you can use the synchronous flag, like so:

var pageText;

GM_xmlhttpRequest ( {
    method:         'GET',
    url:            'http://google.com',
    onload:         function (responseDetails) {
                        pageText = responseDetails.responseText;

                        //-- This will alert the page contents.
                        alert (pageText);
                    },
    synchronous:    true
} );

/*--- This will also alert the text, but the page/GM script can appear 
    to "freeze" for a bit.
*/
synchronous:    true
alert (pageText);

this way is better than jquery load(). But now I've other problem, I explain here: http://stackoverflow.com/questions/8753245/gm-xmlhttprequest-loses-data-in-jquery-each-statement — papelucho, Jan 06 '12 at 04:14

jQuery load() gives empty results with Greasemonkey

3 Answers3