简单易懂的天气插件(代码分享)

效果图如下:

代码如下所示:

<!DOCTYPE html>
<html>
 <head>
 <meta charset="UTF-8">
 <title>天气</title>
 <meta name="viewport" content="width=device-width,initial-scale=1"/>
 <style type="text/css">
  .xc{
  width: 200px;
  margin: 0 auto;
  }
 </style>
 </head>
 <body>
 <div id="tp-weather-widget" class="xc"></div>
 <script>
  (function(T, h, i, n, k, P, a, g, e) {
  g = function() {
   P = h.createElement(i);
   a = h.getElementsByTagName(i)[0];
   P.src = k;
   P.charset = "utf-8";
   P.async = 1;
   a.parentNode.insertBefore(P, a)
  };
  T["ThinkPageWeatherWidgetObject"] = n;
  T[n] || (T[n] = function() {
   (T[n].q = T[n].q || []).push(arguments)
  });
  T[n].l = +new Date();
  if(T.attachEvent) {
   T.attachEvent("onload", g)
  } else {
   T.addEventListener("load", g, false)
  }
  }(window, document, "script", "tpwidget", "//widget.thinkpage.cn/widget/chameleon.js"))
 </script>
 <script>
  tpwidget("init", {
  "flavor": "slim",
  "location": "WX4FBXXFKE4F",
  "geolocation": "disabled",
  "language": "zh-chs",
  "unit": "c",
  "theme": "chameleon",
  "container": "tp-weather-widget",
  "bubble": "enabled",
  "alarmType": "badge",
  "color": "#F47837",
  "uid": "U605DCADA4",
  "hash": "78f46a1198d54dafa0cda717efa717a9"
  });
  tpwidget("show");
 </script>
 </body>
</html>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持我们!

(0)

相关推荐

  • ASP.NET使用WebService实现天气预报功能

    本文使用Asp.Net (C#)调用互联网上公开的WebServices(http://www.webxml.com.cn/WebServices/WeatherWebService.asmx)来实现天气预报,该天气预报 Web 服务,数据来源于中国气象局http://www.cma.gov.cn/,数据每2.5小时左右自动更新一次,准确可靠.包括 340 多个中国主要城市和 60 多个国外主要城市三日内的天气预报数据. 效果图 : 步骤 : 1 .新建web 项目,添加窗体. 2 . 引用右键

  • Jquery获取当前城市的天气信息

    本文实例为大家分享了Jquery获取当前城市的天气信息代码,供大家参考,具体内容如下 HTML代码: <div id="weather"></div> Jquery代码: function findWeather() { var cityUrl = 'http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js'; $.getScript(cityUrl, function(script, textSt

  • 编写简易Android天气应用的代码示例

    本文所要介绍的简易天气App主要用RxAndroid.MVP.Retrofit实现,首先来看看效果: 主页内容: 右侧栏天气列表: 左侧栏城市列表 首先看看Activity主要代码(使用MVP模式): //调用Presenter的方法获取数据 mMainPresenter = new MainPresenterImpl(this); mMainPresenter.getPlaceData(); mMainPresenter.getWeatherData("成都"); //显示主页和右侧

  • 用Java实现全国天气预报的api接口调用示例

    step1:选择本文所示例的接口"全国天气预报接口" 聚合数据url:http://www.juhe.cn/docs/api/id/39/aid/87 step2:每个接口都需要传入一个参数key,相当于用户的令牌,所以第一步你需要申请一个key. step3:学过java的同学们都知道,当我们对一个类或者方法不明白其意图和思想时,我们可以去查看文档,这里也不例外,而且对于英文不是特别好的同学来说很幸运的是,聚合网站上的文档都是中文版本的,比起阅读java源码里的英文文档应该轻松很多.

  • Android天气预报app改进版

    最近总是有人来和我说我以前写的一个小app无法正常获取数据~Android简易版天气预报app 今天就又运行了下来查找问题,发现或许是接口有限制吧,不能在多台手机使用同个apikey 然后,发现了我写的代码实在乱七八糟,界面也实在不好看,就又重写了一遍,小小地修改了一遍,开发环境改为了Android Studio 最终效果图如下 工程图如下 一.获取地区信息 做这么一个天气预报app,首先就要获取到国内地区列表 (在我的另一篇博客有介绍:向任意网址发起数据请求) 中国天气网开放有天气预报接口,访

  • PHP Ajax JavaScript Json获取天气信息实现代码

    要在自己的网站上添加一个天气预报功能,是一个很普通的需求,实现起来也不是很难.今天来介绍几个简单的方法. 使用第三方服务 有这样的一种简单的方式,借助http://www.tianqi.com/plugin/网上的天气服务,可以定制我们的显示形状,实现添加天气预报的功能. 下面给出一个简单的小例子: 复制代码 代码如下: <iframe width="420" scrolling="no" height="60" frameborder=&

  • asp.net实现根据城市获取天气预报的方法

    本文实例讲述了asp.net实现根据城市获取天气预报的方法.分享给大家供大家参考,具体如下: public void GetWetheaerByCity(string cityName) { string city = cityName; string mycity = HttpUtility.UrlEncode(city, System.Text.Encoding.GetEncoding("GB2312")); System.Net.HttpWebRequest request =

  • PHP微信开发之查询城市天气

    PHP微信查询城市天气,首先,你需要找到一个获取天气的API,此处,我用的是百度的apistore,申请和使用API的网址:http://apistore.baidu.com/apiworks/servicedetail/112.html 登录百度账号,并用手机发送请求获取apikey.有了apikey,可以按照它的示例来请求城市天气了.(可以按照城市中文名,拼音,城市编号等来查询) 你可以现在本地做测试,请求完成之后,再放到自己的域名空间的脚本里.  测试的脚本例如:(注意apikey填写自己

  • Android编程实现获取新浪天气预报数据的方法

    本文实例讲述了Android编程实现获取新浪天气预报数据的方法.分享给大家供大家参考,具体如下: 新浪天气预报地址: http://php.weather.sina.com.cn/xml.php?city=武汉&password=DJOYnieT8234jlsK&day=0 其中,city后的城市可用java.net.URLEncoder.encode("武汉"," gb2312");也可以直接写"武汉",但不能用"wu

  • js获取新浪天气接口的实现代码

    js获取新浪天气接口的实现代码 <!doctype html> <html class="no-js fixed-layout"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>天气</title> </

  • JS显示日历和天气的方法

    本文实例讲述了JS显示日历和天气的方法.分享给大家供大家参考,具体如下: 运行效果截图如下: 完整代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml&qu

随机推荐