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,
html+javascript+soap获取webservice免费天气预报信息的更多相关文章
- HttpWebRequest post请求获取webservice void数据信息
private void button2_Click(object sender, EventArgs e) { Hashtable ht = new Hashtable(); ht["sc ...
- javascript 常用获取页面宽高信息 API
在页面的构建中 常常会需要获取页面的一些宽高信息,例如实现 惰性加载图片 需要获取页面的可见区域高度 和 已滚动区域的高度,以判断图片所在位置是否可见来决定加载图片的时间, 花点时间整理了一下,获取页 ...
- C#获取中国天气网免费天气预报信息
中国天气网接口地址:”http://wthrcdn.etouch.cn/WeatherApi?citykey=” + weatherCityCode(为城市code); 下面是转化过程中我们需要用到的 ...
- Javascript UserAgent 获取平台及浏览器信息
公司最近要做一套类似于百度统计的功能,于是收集整理了其中根据UserAgent获取客户端平台及浏览器信息的资料,不仅仅试用于Javascript,其他语言也可以参考相应正则进行改进.当然,肯定有不足的 ...
- C#使用SOAP获取webservice实例解析
本文主要參考例如以下两个链接.并整理: Java使用SOAP: http://www.cnblogs.com/linjiqin/archive/2012/05/07/2488880.html C# s ...
- 获取WebService的请求信息
一个已经写好的项目中有多个WebService,由于之前没有记录请求信息的,有时候需要查错等需要找到当次的请求信息,所以需要加入记录请求信息的功能. 首先想到的是在每一个带有WebMethod特性的方 ...
- 通过 jsp+ajax+servlet+webservice 远程访问天气预报服务
通过 jsp+ajax+servlet+webservice 远程访问天气预报服务 - webservice 客户端访问的方式 1. java代码来访问 2. ajax 方式异步加 ...
- 调用webservice获取电话号码归属地信息
首先什么是webservice ? 从广义上面讲,任何一个服务器所提供的"数据","内容","方法"等等都可以理解为webservice. ...
- [整]C#获取天气预报信息(baidu api)包括pm2.5
/// <summary> /// 获取天气预报信息 /// </summary> /// <returns></returns> public Bai ...
随机推荐
- ubuntu下中文乱码解决
这个方法只对该用户有效. 方法二:修改/etc/environment,增加以下内容: LANGUAGE=”zh_CN:zh:en_US:en” LANG=zh_CN.GBK
- composer.json 配置设置
配置文件的值为 key:val 必须双引号包裹 一.配置文件 名字 name包名称由用户名名称和仓库名称组成包版本限制来请求Monolog软件包 1.0.*.这意味着1.0开发分支中的任何版本,或大于 ...
- DropDownList年份的添加
http://blog.sina.com.cn/s/blog_4b9e030e01007sc3.html
- HDU1398 Square Coins
Description People in Silverland use square coins. Not only they have square shapes but also their v ...
- Java字符容量capacity()方法
Java字符容量计算:比如StringBuffer sb=new StringBuffer("Good");输出 .
- 使用 Moq 测试.NET Core 应用
第一篇文章, 关于Mock的概念介绍: https://www.cnblogs.com/cgzl/p/9294431.html 第二篇文章, 关于方法Mock的介绍: https://www.cnbl ...
- JS数组去重总结
方法一: 双层循环,外层循环元素,内层循环时比较值 如果有相同的值则跳过,不相同则push进数组 Array.prototype.distinct = function(){ var arr = th ...
- js和jq中常见的各种位置距离之offset和offset()的区别(三)
offsetLeft:元素的边框的外边缘距离与已定位的父容器(offsetparent)的左边距离(不包括元素的边框和父容器的边框). offset().left:返回的是相对于当前文档的坐标,使用o ...
- ORACLE CBC LATCH 检查
###############1.DB meet latch: cache buffers chains event from awr report ,check latch: cache buffe ...
- CESM部署安装环境和使用
平台信息 Description: CentOS Linux release 7.6.1810 (Core) 安装CESM 安装前提:(小提示:耗时较长,需要耐心)阅读原文 CentOS 7(检查:s ...