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


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 相关文章推荐
js获取select标签选中值的两种方式
Jan 09 Javascript
js 触发select onchange事件代码
Mar 20 Javascript
异步JS框架的作用以及实现方法
Oct 29 Javascript
js实现的简单图片浮动效果完整实例
May 10 Javascript
H5手机端多文件上传预览插件
Apr 21 Javascript
用原生JS实现简单的多选框功能
Jun 12 Javascript
react-router browserHistory刷新页面404问题解决方法
Dec 29 Javascript
vue.js系列中的vue-fontawesome使用
Feb 10 Javascript
浅谈Vue-cli单文件组件引入less,sass,css样式的不同方法
Mar 13 Javascript
apicloud拉起小程序并传递参数的方法示例
Nov 21 Javascript
JavaScript页面加载事件实例讲解
Sep 01 Javascript
微信小程序实现录音功能
Nov 22 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
MySQL数据源表结构图示
2008/06/05 PHP
zend api扩展的php对象的autoload工具
2011/04/18 PHP
PHP内核介绍及扩展开发指南―基础知识
2011/09/11 PHP
wordpress自定义url参数实现路由功能的代码示例
2013/11/28 PHP
php 创建以UNIX时间戳命名的文件夹(示例代码)
2014/03/08 PHP
php中get_object_vars()方法用法实例
2015/02/08 PHP
php数组比较实现查找连续数的方法
2015/07/29 PHP
php实现base64图片上传方式实例代码
2017/02/22 PHP
IE浏览器IFrame对象内存不释放问题解决方法
2014/08/22 Javascript
JavaScript 开发工具webstrom使用指南
2014/12/09 Javascript
JS实现的多张图片轮流播放幻灯片效果
2016/07/22 Javascript
Bootstrap导航条学习使用(二)
2017/02/08 Javascript
自定义事件解决重复请求BUG的问题
2017/07/11 Javascript
JS数组操作中的经典算法实例讲解
2017/07/26 Javascript
使用puppeteer破解极验的滑动验证码
2018/02/24 Javascript
javascript+css实现进度条效果
2020/03/25 Javascript
[02:54]辉夜杯主赛事第二日败者组 iG.V赛后采访
2015/12/26 DOTA
python写的一个文本编辑器
2014/01/23 Python
Python中用sleep()方法操作时间的教程
2015/05/22 Python
python批量替换页眉页脚实例代码
2018/01/22 Python
Flask之flask-script模块使用
2018/07/26 Python
Numpy截取指定范围内的数据方法
2018/11/14 Python
python3+selenium自动化测试框架详解
2019/03/17 Python
Django给admin添加Action的步骤详解
2019/05/01 Python
python 解决mysql where in 对列表(list,,array)问题
2020/06/06 Python
基于PyTorch的permute和reshape/view的区别介绍
2020/06/18 Python
如何基于python把文字图片写入word文档
2020/07/31 Python
利用HTML5 Canvas制作一个简单的打飞机游戏
2015/05/11 HTML / CSS
一波HTML5 Canvas基础绘图实例代码集合
2016/02/28 HTML / CSS
Boden英国官网:英国知名原创时装品牌
2018/11/06 全球购物
Camille Jewelry官网:现代女性时尚首饰
2019/07/07 全球购物
营业经理岗位职责
2013/11/10 职场文书
商务英语专业求职信
2014/06/26 职场文书
小学教师个人工作总结2015
2015/04/20 职场文书
情人节单身感言
2015/08/03 职场文书
Win11怎么修改电源模式?Win11修改电源模式的方法
2022/04/05 数码科技