How do I retrieve data from an external XML file and place it in an HTML file?

advertisements

I am trying to retrieve data from an XML file that is not located on my site's server, and then use that data fro various things, such as charts. Here is one example: http://forecast.weather.gov/MapClick.php?lat=40.78158&lon=-73.96648&FcstType=dwml. This is an XML file with the weather data for central park. I want to retrieve the data that is in the <value>tag, which is in the <pressure> tag, so I can create a graph with barometric pressure. I would prefer to do this with JavaScript, but I don't think it's possible to do so when the file isn't on my server.

Note: I do not want a different solution to retrieve the pressure data from somewhere else, because I want to retrieve other pieces of data from other XML files as well.


There's an interesting article about using Yahoo! Pipes to transform Xml weather data to JSON and use the result in a web page without need for any server side stuff (PHP, curl, etc.).

EDIT

Being new to jQuery myself, I a had to dig a little more to find out that (almost) everything described in the first article can be condensed down to

$.getJSON("<your Yahoo pipes url here>&_callback=?", function (data) {
    alert(data.value.items[0].data[0].parameters.wordedForecast.text[0]);
});

using jQuerys builtin JSONP.

Pitfall!

Beware that Yahoo expects the callback url param to be named _callback

Nice summary on Cross-domain communications with JSONP which helped a lot to come up with this answer.