XML文档解析(解决方法)

最新推荐文章于 2021-07-26 19:04:50 发布

Museions

最新推荐文章于 2021-07-26 19:04:50 发布

阅读量539

点赞数

分类专栏：大前端开发文章标签： xml jquery api 天气api

本文解决了你的问题吗？转载注明链接,帮助更多人。

本文链接：https://blog.csdn.net/museions/article/details/72851911

版权

大前端开发专栏收录该内容

157 篇文章 7 订阅

订阅专栏

使用jQuery解析天气api的XML文档

jQuery解析xml其实是非常方便的，它将原生的xml文档封装成为了jq代理对象，这样就跟操作dom元素一样简单了。相比较网上的各种js解析xml的方法（许多都是不靠谱的，费时费力去研究，我也遇到过），后来想到强大的jq也应该有方法，与是去尝试了一下，果然可行，下面是代码！（一段解析天气api的xml文档）[代码较丑]

$.post('http://wthrcdn.etouch.cn/WeatherApi?city=中文城市名',function(xmlDoc){

        var $xmlDoc = $(xmlDoc); //封装成代理对象
        var $aqi =$xmlDoc.find("aqi").text(); //直接使用jQuery API 要先引入jQuery类库
        var $pm25 = $xmlDoc.find("pm25").text();
        var $quality = $xmlDoc.find("quality").text();
        var $updatetime = $xmlDoc.find("updatetime").text();
        var $suggest = $xmlDoc.find("suggest").text();
        var $shidu =  $xmlDoc.find("shidu").text();
        <!--空气质量-->

        $(".aqi").text($aqi);
        $(".pm25").text($pm25);
        $(".quality").text($quality);
        $(".updateTime").text($updatetime);
        $(".suggest").text($suggest);
        $(".shidu").text($shidu);

        var $weather = $xmlDoc.find('weather').eq(0);
        var $high_tem = $weather.find("high").text();
        var $low_tem = $weather.find("low").text();
        var $type = $weather.find("type").eq(0).text();


        $(".low-high").text($low_tem+'~'+$high_tem);
        $(".weather-type").text($type);
        var weather=["static/img/weather/0.png","static/img/weather/1.png","static/img/weather/2.png","static/img/weather/8.png","static/img/weather/15.png","static/img/weather/33.png",];if($type=="晴"){$(".weather-today").attr("src",weather[0])}if($type=="阴"){$(".weather-today").attr("src",weather[2])}if($type=="多云"){$(".weather-today").attr("src",weather[1])}if($type=="小雨"||$type=="中到大雨"||$type=="小到中雨"){$(".weather-today").attr("src",weather[3])}if($type=="小雪"||$type=="大雪"||$type=="中雪"){$(".weather-today").attr("src",weather[4])}if($type=="霾"){$(".weather-today").attr("src",weather[5])};




        var $sports = $xmlDoc.find("zhishus").find("zhishu").eq(8);//运动
        var $wear = $xmlDoc.find("zhishus").find("zhishu").eq(2);//穿衣
        var $sick = $xmlDoc.find("zhishus").find("zhishu").eq(3);//感冒
        var $sun = $xmlDoc.find("zhishus").find("zhishu").eq(4);//晾晒
        var $washCar = $xmlDoc.find("zhishus").find("zhishu").eq(7);//洗车
        var $trip = $xmlDoc.find("zhishus").find("zhishu").eq(5);//雨伞


        var $im_sports = $(".im_sport");
        var $im_wear = $(".im_wear");
        var $im_sick = $(".im_sick");
        var $im_sun = $(".im_sun");
        var $im_wash = $(".im_wash");
        var $im_trip = $(".im_trip");




        var ZHISHUAPI = [$sports,$wear,$sick,$sun,$washCar,$trip];
        var ZHISHU = [$im_sports,$im_wear,$im_sick,$im_sun,$im_wash,$im_trip]
        for(var i=0;i<ZHISHUAPI.length;i++){
            var $value = ZHISHUAPI[i].find("value").text();
            var $detail  = ZHISHUAPI[i].find("detail").text();
            ZHISHU[i].find("span").text($value);
            ZHISHU[i].find(".infor").text($detail);


        }
    })
    <!--第一次使用markdown-->