html+javascript+soap获取webservice免费天气预报信息

转自:http://blog.163.com/hubeimeiyu@126/blog/static/8004881020118303318687/

首先,也是最重要的是互联网上免费的天气预报源:
http://www.webxml.com.cn/WebServices/WeatherWebService.asmx
用浏览器打开这个网页,可以看到简要的说明,通过soap想这个地址发送GET或POST请求,能够得到需要的地区天气预报信息,每2.5个小时更新一次。
第二、写简单的html页面并且向里面添加js函数访问上面的页面,递交请求,简单的html页面如下:
<html>
<head>
<script type="text/javascript" >
function get(){    
//>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
   }
</script>
</head>
<body onload="get()">
<input type=text id="data" name="sd">
</body>
</html>
在简单的页面中写js函数,当这个页面被浏览器打开的时候这个get函数里面的内容就可以执行。这里我们get函数实现的功能是创造soap头,发送请求,返回请求,处理返回的xml
第三、添加访问的链接地址:
    var URL="http://www.webxml.com.cn/WebServices/WeatherWebService.asmx";
第四、添加一个变量,作用为城市:
    var city = "北京";
第五、再创造发送的数据包:
    var     data = '<?xml version="1.0" encoding="UTF-8"?>';
    data = data + '<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">';
    data = data + '<soap:Body>';
    data = data + '<getWeatherbyCityName xmlns="http://WebXml.com.cn/">';
    data = data + '<theCityName>'+city+'</theCityName>';
    data = data + '</getWeatherbyCityName>';
    data = data + '</soap:Body>';
    data = data + '</soap:Envelope>';    
第六、再新建一个xmlhttp对象:
        if(window.ActiveXObject)
            {
                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
            else if(window.XMLHttpRequest)
            {
                xmlhttp=new XMLHttpRequest();
            }
第七、添加xmlhttp的发送方式、发送头和发送该包。
        xmlhttp.open("POST",URL, false);
        xmlhttp.setRequestHeader("CONTENT-TYPE","text/xml;charset=UTF-8");
        xmlhttp.setRequestHeader ("SOAPAction","http://WebXml.com.cn/getWeatherbyCityName");
        xmlhttp.send(data);
第八、处理xmlhttp返回的内容,这里使用一个23位的数组接受这个字符串,
        var xmlDoc = xmlhttp.responseXML;
        var weather = new Array(23);
        for(i=0;i<23;i++)
        weather[i] = xmlDoc.documentElement.childNodes(0).childNodes(0) .childNodes(0).childNodes(i).text;
最后、完成的这个字符串,想怎么处理就怎么处理,可以alert,可以document.write,随你。这里我alert一下。
        alert(weather);
大功告成了!当然这个代码好想有很多不兼容的问题,例如目前不兼容firefox,

posted @ 2018-05-15 14:57  天晴微笑  阅读(1284)  评论(0编辑  收藏  举报