如何将XML标记的值获取到HTML页面中

I need to display the local weather in a PowerPoint slideshow (which updates itself regularely without human interaction). I have in mind to create a local html file that loads the data from the web and displays that in lateron in the ppt.

我需要在PowerPoint幻灯片中显示本地天气(在没有人工干预的情况下,它会正常更新)。我想到了创建一个本地html文件,该文件从Web加载数据并在ppt的后面显示。

This is how the XML looks like (I load that from http://api.openweathermap.org/data/2.5/weather?q=Basel&mode=xml&units=metric)

这就是XML的样子(我从http://api.openweathermap.org/data/2.5/weather?q=Basel&mode=xml&units=metric加载)

<?xml version="1.0" encoding="UTF-8"?>
<current>
  <city id="2661604" name="Basel">
    <coord lon="7.57" lat="47.56"/>
    <country>CH</country>
    <sun rise="2014-04-30T04:13:21" set="2014-04-30T18:40:25"/>
  </city>
  <temperature value="12" min="12" max="12" unit="celsius"/>
  <humidity value="76" unit="%"/>
  <pressure value="1012" unit="hPa"/>
  <wind>
    <speed value="4.1" name="Gentle Breeze"/>
    <direction value="280" code="W" name="West"/>
  </wind>
  <clouds value="75" name="broken clouds"/>
  <precipitation value="1" mode="rain" unit="3h"/>
  <weather number="803" value="broken clouds" icon="04d"/>
  <lastupdate value="2014-04-30T11:00:00"/>
</current>

How do I now get the values from these tags into my html file?

我现在如何从这些标签中获取值到我的html文件中?

I need it to be something like this:

我需要它是这样的:

• Temperature: 12°C (I need the 12 from <temperature value="">

温度:12°C(我需要12来自 <温度值=“”>

• Weather icon from URL: http://openweathermap.org/img/w/04d.png (the url is static exept the 04d comes from the XML)

来自URL的天气图标:http://openweathermap.org/img/w/04d.png(url是静态exept,04d来自XML)

• Sun rise: 6.13 am (<sun rise=""> +2 in summertime and +1 in wintertime)

太阳升起:上午6点13分(夏季 <太阳升起=“”> +2,冬季+1点)

• Sun set: 8.40 pm (same as above)

太阳落山:晚上8点40分(与上述相同)

• last update: xxx

最后更新:xxx

There is also a JSON version of the API (http://api.openweathermap.org/data/2.5/weather?q=Basel&mode=json&units=metric) and I would take whichever I get to work the fastest.

还有一个JSON版本的API(http://api.openweathermap.org/data/2.5/weather?q=Basel&mode=json&units=metric),我会采取最快的工作。

Also I would run it on our local windows XP machine (so no php available) but it it would only work with php I could get that to work easily.

此外,我会在我们的本地Windows XP机器上运行它(所以没有PHP可用),但它只适用于PHP我可以让它轻松工作。

Thanks for any help.

谢谢你的帮助。

1 个解决方案

#1

You can use javascript/ jQuery. Add <div id="xml-data"></div> and code bellow on your html page. Hope I help.

你可以使用javascript / jQuery。在你的html页面上添加

和代码。希望我帮忙。

<script>
jQuery(document).ready(function(){
    jQuery.ajax({
            type: "GET", 
            url: "http://api.openweathermap.org/data/2.5/weather?q=Basel&mode=xml&units=metric", 
            dataType: "xml", 
            success: function(xml) { 

            jQuery(xml).find('current').each(
                    function()
                    {
                      var city_name = jQuery(this).find('city').attr('name'),
                      country = jQuery(this).find('country').text(),
                      temperature = jQuery(this).find('temperature').attr('value');

                     jQuery('<div class="items"></div>').html('<h2>'
                      +city_name+'</h2><p>'
                      +country+'</p><p>'
                      +temperature+'</p>').appendTo('#xml-data');

                    });                 
            }
    });
});
</script>