CODEWITHSUNDEEP
javascriptjqueryajax
jrad
jrad

Reputation: 3190

Ajax read HTML after fully processed

I am trying to load the HTML content of a webpage outside of my domain, which I can do just fine using functionality provided by this jQuery plugin: http://www.ajax-cross-origin.com/. However, when I print out the HTML there are pieces missing, which I assume is because the ajax request gets the HTML before the page is fully loaded. When I say "pieces missing," I mean that some tags that should have innerHTML in fact have none. Here's my code:

$.ajax({
    crossOrigin: true,
    url: "http://siriusxm.com/bpm",
    success: function(data) {
        console.log(data);
    },
    timeout: 5000
});

The crossOrigin attribute is from the plugin I mentioned. I get the same behavior with and without the timeout (and strangely, it doesn't seem as though the timeout is doing anything at all--when I check the console, it logs data pretty much immediately).

Is there a way to wait until the page is fully loaded before getting the content? For what it's worth, this is all part of a chrome extension I'm developing, so if there's anything else code-wise you might need just ask.

Thanks!

Upvotes: 0

Views: 97

Answers (2)

cyk
cyk

Reputation: 581

So according to your comments, the information you're looking for is just the Now Playing artist and Song, which you won't be able to get by loading just the source of the main page.

To find the data you're looking for just open up your Chrome DevTools, go to the network tab, and Refresh to see all requests on the page.

It looks like this is the request you want, you just need to update the timestamp every minute: http://www.siriusxm.com/metadata/pdt/en-us/json/channels/thebeat/timestamp/08-12-03:48:00

Just parse that json and grab what you need. Of course they can always change the location or format of the file, but for right now that's what it is.

Upvotes: 1

Caff3in3fr33
Caff3in3fr33

Reputation: 1

If the console log is showing all of the data you're looking for then the ajax call should be fine.

Any code in the success callback will be ran after the ajax call, so just use JQuery in the success callback function to insert data into the html. All I see there now is the console.log(data) unless you've removed some code.

The timeout just gives the ajax call a set amount of time to complete before it "times out", in other words it tells it to stop waiting after the set amount of time.

Upvotes: 0

Related Questions