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


Posted in Javascript onFebruary 04, 2017

效果图如下:

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

代码如下所示:

<!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>

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

Javascript 相关文章推荐
RGB颜色值转HTML十六进制(HEX)代码的JS函数
Apr 25 Javascript
JS修改css样式style浅谈
May 06 Javascript
Jquery each方法跳出循环,并获取返回值(实例讲解)
Dec 12 Javascript
javascript html实现网页版日历代码
Mar 08 Javascript
多功能jQuery树插件zTree实现权限列表简单实例
Jul 12 Javascript
vue mint-ui tabbar变组件使用
May 04 Javascript
纯JS实现的读取excel文件内容功能示例【支持所有浏览器】
Jun 23 Javascript
在Vue项目中使用jsencrypt.js对数据进行加密传输的方法
Apr 17 Javascript
解决layui弹出层layer的area过大被遮挡的问题
Sep 21 Javascript
js实现带箭头的进度流程
Mar 26 Javascript
vue treeselect获取当前选中项的label实例
Aug 31 Javascript
小程序自定义圆形进度条
Nov 17 Javascript
URL中“#” “?” &amp;“”号的作用浅析
Feb 04 #Javascript
Angularjs 依赖压缩及自定义过滤器写法
Feb 04 #Javascript
javascript实现复选框全选或反选
Feb 04 #Javascript
JavaScript获取当前时间向前推三个月的方法示例
Feb 04 #Javascript
javascript表单正则应用
Feb 04 #Javascript
JS中的phototype详解
Feb 04 #Javascript
详解JavaScript RegExp对象
Feb 04 #Javascript
You might like
php生成txt文件标题及内容的方法
2014/01/16 PHP
PHP类中的魔术方法(Magic Method)简明总结
2014/07/08 PHP
PHP aes (ecb)解密后乱码问题
2015/06/22 PHP
php实现中文转数字
2016/02/18 PHP
替换php字符串中的单引号为双引号的方法
2017/02/16 PHP
PHP实现微信商户支付企业付款到零钱功能
2018/09/30 PHP
php设计模式之工厂方法模式分析【星际争霸游戏案例】
2020/01/23 PHP
JavaScript 在线压缩和格式化收藏
2009/01/16 Javascript
JavaScript效率调优经验
2009/06/04 Javascript
js 弹出菜单/窗口效果
2011/10/30 Javascript
formStorage 基于jquery的一个插件(存储表单中元素的状态到本地)
2012/01/20 Javascript
js获取dom的高度和宽度(可见区域及部分等等)
2013/06/13 Javascript
jquery showModelDialog的使用方法示例详解
2013/11/19 Javascript
Javascript中arguments对象详解
2014/10/22 Javascript
Angular1.x自定义指令实例详解
2017/03/01 Javascript
Angular.JS去掉访问路径URL中的#号详解
2017/03/30 Javascript
整理一些最近经常遇到的前端面试题
2017/04/25 Javascript
JS库particles.js创建超炫背景粒子插件(附源码下载)
2017/09/13 Javascript
记一次vue-webpack项目优化实践详解
2019/02/17 Javascript
angular 服务随记小结
2019/05/06 Javascript
JS数组方法push()、pop()用法实例分析
2020/01/18 Javascript
python实现将excel文件转化成CSV格式
2018/03/22 Python
对python过滤器和lambda函数的用法详解
2019/01/21 Python
Python读取指定日期邮件的实例
2019/02/01 Python
Anaconda+spyder+pycharm的pytorch配置详解(GPU)
2020/10/18 Python
python字典按照value排序方法
2020/12/28 Python
美国羊皮公司:Overland
2018/01/15 全球购物
C,C++的几个面试题小集
2013/07/13 面试题
房地产销售计划书
2014/01/10 职场文书
无故旷工检讨书
2014/01/26 职场文书
《乡愁》教学反思
2014/02/18 职场文书
工作求职自荐信
2014/06/13 职场文书
大学校园餐饮创业计划书
2019/08/07 职场文书
jquery插件实现搜索历史
2021/04/24 jQuery
Python中else的三种使用场景
2021/06/16 Python
Redis 异步机制
2022/05/15 Redis