Question

I have a problem here. I’m trying to manipulate a web page using jquery. I think I can explain it better if I give you an example:

I have my web page but I need to get some information from another web page. It’s like… When you create a web playlist but I wanna get the lyrics from another web site to display together while the music is playing.

My web page -> get information from (www.LyricsWebSite.com) -> return lyric.

Is that possible? How can I do it? I want to manipulate some specific field (id) to get that information. Can anyone help me, please?

Answer 1

Whenever you want information from a site not yours in your own page, this becomes a rough investigation order:

1. Search if the site has a ‘REST’ API. (jsonp based, if you want to do the logic solely in javascript). If the API exists and has the info you need, use that.
2. If the site does not have an API you can consume, then you have to somehow have server-side code make the actual request to the 3rd-party site to extract it’s info, and your Javascript needs to know ask your server for ‘the answer’. The reason for this design requirement is that it is not possible to use only javascript to call to sites on a different domain than yours (google cross-domain javascript for more info, if unfamiliar with that restriction.)

I have heard good things about Yahoo Pipes. It is a very particular way of solving the #2 path.

Also, whenever you are extracting data from another site using either mechanism, be sure to check their licensing/agreements. You may find that they actively disallow this sort of thing.