自动获取位置给予天气预报数据和视图(高德,vue可用)
最新分享News<li><i class="el-cloud"></i>天气预报<iframe id="tianqi" scrolling="no" frameborder="0" allowtransparency="true"...
·
----------填充json格式(vue,高德地图可用)----------------------
实时最新数据网站(数据来源与彩云天气)https://api.caiyunapp.com/v2/qdtgU5C6Bhvmmxoa/116.4009,39.9033/forecast.jsonp?callback=?
116.4009,39.9033为当前获取数据的经纬度
可以通过高德开发者工具来找到自己需要的经纬度
最新分享 News
<li><i class="el-cloud"></i>天气预报
<iframe id="tianqi" scrolling="no" frameborder="0" allowtransparency="true"
src="http://i.tianqi.com/index.php?c=code&a=getcode&id=34&h=25&w=280"></iframe>
</li>
<li><i class="el-calendar"></i>历史今天:
<iframe src="http://www.todayonhistory.com/code/6.html?w=250&h=20&bky=dotted&bks=0&fs=14&fc=#565656&hg=14&ie=0&xhx=none&sd=300&px=3&len=0&sk=1&n=0"
width="250" height="15" scrolling="no" frameborder="0" allowtransparency="true"></iframe>
</li>
</ul>
</div>
完整的网页引用:可以使用iframe来调用到他网页中
<html ><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
<title>天气预报代码调用</title>
<!--[if IE 6]>
<script type="text/javascript" mce_src="DD_belatedPNG.js" src="//static.tianqistatic.com/static/js/DD_belatedPNG.js"></script>
<script type="text/javascript">DD_belatedPNG.fix(".pngtqico");</script>
<![endif]-->
<script type="text/javascript" src="../../static/js/jquery-1.8.2.min.js"></script>
<script type="text/javascript">
var color = bgcolor = bdcolor = site = icon = "";
var num = 0;
$(document).ready(function(){
init();
if (typeof(bgcolor) != 'undefined' && bgcolor != '') {
$("#mobile280").css('background-color', bgcolor);
}
if (typeof(bdcolor) != 'undefined' && bdcolor != '') {
$("#mobile280").css('border', '1px solid ' + bdcolor);
}
if (typeof(color) != 'undefined' && color != '') {
$("#mobile280").css('color', color);
$("#mobile280 a").css('color', color);
$("#mobile280 .f1").css('color', color);
$("#mobile280 .wtpic font").attr("color","");
}
if (typeof(temp) != 'undefined' && temp == 0) {
$("div.wt2").remove();
}
});
function init(){
if(num==0) num=5;
for (var i=5; i > num; i--) {
$("#day_"+i).remove();
}
if (typeof(icon) != 'undefined' && icon != '') {
$("img.pngtqico").each(function(i){
this.src = this.src.replace("tianqibig", icon);
});
}
}
</script>
<style type="text/css">
body{margin:0;padding:0;font-size:12px; font-family:"微软雅黑"}
body, h1, h2, h3, h4, h5, h6, hr, p, dl, dt, dd, ul, ol, li, pre, fieldset, textarea, th, td{ margin: 0;padding: 0;}
em{font-size: 12px;font-weight: normal;font-style: normal;}
ul{list-style-type:none;margin:0;padding:0;}
li{list-style-type:none;margin:0;padding:0;}
img{border:0;}
a:link,a:visited,a:hover,a:active{color:#333;text-decoration:none;}
a:hover{color:#333;text-decoration:none;}
.box{ float:left; width:288px; height:25px; line-height:25px; overflow:hidden;}
.box strong{float:left; font-size:12px; padding:0 6px 0 0;}
.box .wtpic{height:22px;width:22px;float:left; padding:0 6px 0 0;}
.box .wtline{float:left; height:25px; line-height:25px;margin-top:0; padding:0;}
.box .st{float:left; height:25px; line-height:25px;padding:0 6px;}
.box .kqzl{float:left; height:25px; line-height:25px;margin-top:0; padding:0 6px 0 0;}
.box .zl_txt{float:left; height:20px; line-height:20px;margin-top:2px; padding:0 6px; background:#9ED15B; color:#fff;}
.gk_box .wtpic{line-height:25px;height:20px;float:left;width:100%;}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {text-decoration: none;}
a:active {text-decoration: none;}
</style>
</head>
<body marginwidth="0" marginheight="0" style="background-color:transparent">
<div id="mobile280" style="float:left;width:280px; height:25px; position:relative;" >
<div class="box" style="font-size: 12px;">
<a target="_blank" href="http://wuxi1.tianqi.com/?tq"><span class="wtpic"><img class='pngtqico' align='absmiddle' src='//plugin.tianqistatic.com/static/images/tianqi/b0.png' style='border:0;width:20px;height:20px'/></span>
<span class="wtline">8℃~20℃</span>
<span class="st">|</span><span class="kqzl">空气质量:</span><span class="zl_txt" style="background:#eee8d9">
良</span></a></div>
<div style="display: none;">
</div>
</div >
<div style="display: none;">
<script type="text/javascript">
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?86f43783acc56b0c8abb5bb039edc763";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
<script type="text/javascript" src="https://s5.cnzz.com/z_stat.php?id=1277635480&web_id=1277635480"></script>
</div>
</body></html><script type="text/javascript">num=0;temp=0;</script>
—时间封装 格式: 20xx年xx月x-xx时xx分14秒 ----
<div class="showTime">当前时间:20xx年xx月x-xx时xx分14秒</div>
<script>
var t = null;
t = setTimeout(time, 1000); //開始运行
function time() {
clearTimeout(t); //清除定时器
dt = new Date();
var y = dt.getFullYear();
var mt = dt.getMonth() + 1;
var day = dt.getDate();
var h = dt.getHours(); //获取时
var m = dt.getMinutes(); //获取分
var s = dt.getSeconds(); //获取秒
document.querySelector(".showTime").innerHTML =
"当前时间:" +
y +
"年" +
mt +
"月" +
day +
"-" +
h +
"时" +
m +
"分" +
s +
"秒";
t = setTimeout(time, 1000); //设定定时器,循环运行
}
</script>
更多推荐
已为社区贡献8条内容
所有评论(0)